Lecture 9: JavaScript Syntax Variables, Data Type, Statements

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.

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;

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

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”

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

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

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?

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

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

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.

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}

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; }

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); }

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”

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);

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

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?

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”);

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

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];

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”);