Calculator

JavaScript Exercise from Nashville Software School

HTML

<header>Welcome to the Basic JavaScript Calculator</header>

  <div id="calculator" style="text-align: center">
    <div>
      <input type="text" id="firstOperand" autofocus="true" placeholder="First Number">

      <input type="text" id="secondOperand" placeholder="Second Number">

      <input type="text" id="result" placeholder="Result" style="color:blue; font-weight:bold">
    </div>
    
    <div style="text-align: center; margin: 1em">
      <button id="add">Add</button>
      <button id="subtract">Subtract</button>
      <button id="multiply">Multiply</button>
      <button id="divide">Divide</button>
  </div>

CSS

header {
  text-align: center;
  margin-bottom: 1em;
};

JavaScript

//Basic JavaScript Calculator

//BASIC MATHEMATICAL OPERATIONS

/*
  Create a function that multiplies two numbers
  passed in as arguments. Return the product.
 */
function multiply(first, second) {
  return first * second;
};

/*
  Create a function that adds two numbers
  passed in as arguments. Return the sum.
 */

function add(first, second) {
  return first + second;
};

/*
  Create a function that subtracts two numbers
  passed in as arguments. Return the difference.
 */
function subtract(first, second) {
  return first - second; 
};


/*
  Create a function that divides two numbers
  passed in as arguments. Return the quotient.
 */
 function divide(first, second) {
  return first / second;
 };

/*
  Create a function that accepts three arguments.
    1. First number
    2. Second number
    3. A function that performs an operation on them

  Return the value of the operation.
 */

function performOperation (first, second, operation) {
  return operation(first, second);
};


var result = document.getElementById("result").innerHTML;

document.getElementById("multiply").addEventListener("click", function(event) {

  var firstOperand = parseInt(document.getElementById("firstOperand").value);
  var secondOperand = parseInt(document.getElementById("secondOperand").value);

  var result = performOperation(firstOperand, secondOperand, multiply);
  document.getElementById("result").value = result;
  console.log("multiply result", result);
});

document.getElementById("add").addEventListener("click", function(event) {
  var firstOperand = parseInt(document.getElementById("firstOperand").value);
  var secondOperand = parseInt(document.getElementById("secondOperand").value);

  var result = performOperation(firstOperand, secondOperand, add);
  document.getElementById("result").value = result;
  console.log("add result", result);
});

document.getElementById("subtract").addEventListener("click", function(event) {
  var firstOperand =...