1. Lecture 9: JavaScript Syntax
Variables, Data Type, Statements

2. Variables Each variable has a name and value
var firstname = “Guanyu”;
var number = 1;
Variable declaration. To declare a variable, use the var keyword.
var age = 21; //so I can drink.

3. Variables
Initialization: gives a variable its value for the first time. The value can change later, but it is only initialized once
var lastname = “Tian”;
Assignment: you can set a variable’s value many times.
lastname = “Jordan”;
Age = 50;

4. Variables
What will happen if you use a variable that has never been declared or initialized?

5. Data Type
JavaScript has dynamic types. The same variable can be used as different types:
var x; //no data type
var x = 5; //it is a number
x = “Steven” //change to a string
String is data type that stores a series of characters
“google”, “apple”, “microsoft”

6. Data Type
Numbers: JavaScript has only one type of numbers. Numbers can be written with, or without decimals
var x = 34;
var y = 34.00;
Booleans: have two values: true or false
var x = true;
var y = false;s

7. Arithmetic Operations
You can do many operations
+, -, *, /, %.
Precedence: if you have more than one operator, those operators are worked out in a particular order.
/ * 2
(10 + 2) / * 2

8. Logic Operators
Logic Operators works on booleans. They are used to compare two values, on the left and right of the operator, to produce a boolean value.
Equality: use the double or triple equals operator
2 === 3, what is the result?
2 !== 3, what is the result?
Strings containing a number and a number are not equal
‘10’ = ==10, what is the result?

9. Logic Operators Greater than (>) Less than (<)
10 > 5
Less than (<)
10 < 5
Combined comparisons
10 >= 10
10 <= 10

10. Logic Operators Greater than (>) Less than (<)
10 > 5
Less than (<)
10 < 5
Combined comparisons
10 >= 10
10 <= 10

11. Conditional Statement
Logic is used to make decisions in code.
You choose to run one piece of code depending on the logic comparison result. This logic comparison is called a conditional statement
If statement: if some condition is true, run a block of code; otherwise, run another block of code.

12. Conditional Statement
If statement:
if ( 10 > 5 ){
//run the code here }
If … else… statement:
if( 10 > 5 ){ //run the code here }
else{ //run a different piece of code here}

13. Loop Statement
Loop is a way of repeating the same block of code over and over.
While loop: repeats a block of code while a condition is true.
var counter = 1;
while(counter < 10){
alert(counter);
counter++; //counter = counter + 1; }

14. For Statement
For loop: it combines three semicolon-separated pieces information between the parentheses: initialization, condition and a final expression.
for(var counter = 1; counter < 10; counter++) {
alert(counter); }

15. Type Conversion
Type conversion means to convert one type of variable into another type.
There are explicit type conversion
var num = 15
var n = num.toString(); // n is “15”

16. Type Conversion
Type conversion means to convert one type of variable into another type.
There are explicit type conversion
var num = 15;
var n = num.toString(); // n is “15”
var test = true;
Number(test);

17. Type Conversion
Implicit conversion: automatically convert one type of variable to another type
For *, -, /, %, >, <, each of these operator will automatically convert its operands to Number if they are not of this type.
For example:
window.alert(“5” – 2); //display 3

18. Type Conversion
One exception is the + operator: if either of the operands of the + operator are of type String, then the non-String operand will automatically be converted to String, and then the two strings will be concatenated.
For example,
alert(“5” + 3);
What is the result?

19. String Comparison
If both operands to one of relational operators or of == and != are String, then lexicographic string comparison is performed.
e.g: if(“fsu” == “fsu”) alert(“fsu”);
if( “fsu” > “fau”) alert(“fau”);

20. Array An array is used to store multiple values in a single variable.
An array is just one variable that contains a list of values.
e.g., var numbers = new Array();
numbers[0] = 12;
numbers[1] = 15;
numbers[2] = 45;
numbers[3] = 22;
index
value 12 15 1 2 45 3 22

21. Create and Access An Array
var trees = new Array(“maple”, “ashley”, “oak”);
var countries = [“America”, “Spain”, “China”];
Access an array: you refer to an element in an array using the index.
var myCountry = countries[0];

22. Array Methods and Properties
An array has predefined properties and methods:
e.g:
//the number of elements in an array named countries.
alert(countries.length);
//find the index of a particular element in an array.
alert(countries.indexOf(“China”);