1. JavaScript 101 Lesson 3: Variables and Arithmetic

2. Lesson Topics Use the arithmetic operators +, -, *, / to solve problems Use the assignment operator(=) to give a numeric value to a variable How operator precedence controls the order in which an expression is calculated Use the alert method to display information Use the Math object in calculations

3. Using Arithmetic Operators Arithmetic operations in JavaScript are carried out with arithmetic symbols Same as math class (except multiplication is * rather than x) These symbols are called arithmetic operators

4. Arithmetic Operators(cont.) The addition operator + A + B yields the sum of A plus B The subtraction operator – A - B yields the difference A minus B The multiplication operator * A * B yields the product A multiplied by B The division operator / A / B yields the dividend of A divided by B

5. Expressions Expression is computer science term for formula Expression in JavaScript can combine variables, numbers, and arithmetic operators Example: var num1 = 6; var num2 = 3; num1 * 2 is an expression that yields 12 num1/num2 is an expression that yields 2

6. Assignment Operator and Expressions Expressions used with the assignment operator give a value to a variable var length = 5; var width = 6; var area = length * width; (area now has a value of 30)

7. Expressions can combine arithmetic operators Expressions can also have more than one operator: var length = 5; var width = 6; var perimeter; perimeter = length*2 + width * 2; Perimeter now has a value of 22

8. Multiple operators The computer can only execute one operation at a time When an expression has more than one operator, they have to be carried out in order determined by rule of mathematics known as “operator precedence”

9. Operator precedence The operator precedence rules determine the order of evaluation Next slide summarizes operator precedence Operations are carried out in order from top to bottom

10. Operator Precedence Table Type of OperatorExample of Operators Parentheses (Overrides others) ( ) Multiplication, Division *, / Addition, Subtraction+, - Assignment =

11. The alert Method The alert method is used to display a small pop up window See example on p. 3-5 Syntax: alert(“message”);

12. In the lab This lab uses arithmetic operators and alert statement Open Notepad and create a new HTML document named lesson0301.html Enter the code on p. 3-6 exactly as you see it Add code to calculate perimeter and display its value with alert statement (p. 3-8)

13. Student Modifications Change the first document.write statement to an alert statement Add the following variables: base, height and triangleArea Use assignment operator to store values in base and height Calculate and display the area of a triangle (formula is ½*base*height)

14. Student Modifications cont. Add variables radius, circleArea, circleCircumference Use assignment operator to assign value to radius Calculate and display the area and circumference of a circle using the Math.PI Math.PI is a defined constant that is part of Math object Math.PI stores the value of PI

15. Lesson Summary Arithmetic operators Operator precedence Using the alert method Using the Math object