Variables Assignment And Operators

Introduction to variables, assignment and operators in JavaScript.

Transcript

1. variables, assignment and operators Thursday, September 10, 2009
2. variables containers to store information that can be used later http://www.w3schools.com/JS/js_variables.asp Thursday, September 10, 2009
3. Remember Algebra? 5 = x + 3 Thursday, September 10, 2009
4. var var a; var age = 5; var name = 'John Nunemaker'; Thursday, September 10, 2009
5. declaring variables only need var once, but multiple times won’t hurt you // good var age = 15; age // 15 age = 16; age // 16 age = 17; age // 17 // no point var age = 15; age // 15 var age = 16; age // 16 var age = 17; age // 17 Thursday, September 10, 2009
6. undeclared variables automatically declare, but don’t do this x = 10; foo = 'bar'; x // 10 foo // "bar" Thursday, September 10, 2009
7. variables can store anything var age = 15; var name = 'John'; var colors = ['red', 'green', 'blue']; var person = {name:'John', age:15}; var cool = true; var foo = function() { return 'bar'; } Thursday, September 10, 2009
8. naming variables case sensitive var car = 'Ford'; var cAr = 'Toyota'; car // "Ford" cAr // "Toyota" Thursday, September 10, 2009
9. naming variables must begin with letter or underscore var car; // good! var car9; // good! var _car; // good! var 9car; // bad! SyntaxError Thursday, September 10, 2009
10. naming variables can be short or descriptive var x; // short var field; // descriptive Thursday, September 10, 2009
11. naming variables separate words with underscores var section_field_name; // good idea var sectionfieldname; // bad idea Thursday, September 10, 2009
12. naming variables general formatting rules for easier reading var age = 15; // good idea var age=15; // bad idea var age = 15; // bad idea Thursday, September 10, 2009
13. (pause for review and applause) Thursday, September 10, 2009
14. good or bad? var section; Thursday, September 10, 2009
15. good or bad? var section; Thursday, September 10, 2009
16. good or bad? var 10thingsihateaboutyou; Thursday, September 10, 2009
17. good or bad? var 10thingsihateaboutyou; variables cannot start with numbers and should have underscores between words Thursday, September 10, 2009
18. good or bad? var fieldname; Thursday, September 10, 2009
19. good or bad? var fieldname; Should be: var field_name; Thursday, September 10, 2009
20. good or bad? var section_field_name; Thursday, September 10, 2009
21. good or bad? var section_field_name; Thursday, September 10, 2009
22. operators assignment and comparison http://www.w3schools.com/JS/js_operators.asp Thursday, September 10, 2009
23. arithmetic operators operator meaning example result + addition 5 + 5 10 - subtraction 5 - 4 1 * multiplication 2 * 5 10 / division 1 / 4 0.25 % modulus 5 % 4 1 ++ increment x++ x + 1 -- decrement x-- x - 1 Thursday, September 10, 2009
24. assignment operators operator example result same as = var a = 5; 5 += a += 5; 10 a = a + 5; -= a -= 5; 0 a = a - 5; *= a *= 2; 10 a = a * 2; /= a /= 2; 2.5 a = a / 2; %= a %= 4; 1 a = a % 4; Thursday, September 10, 2009
25. comparison operators operator meaning example result equal to value 5 == 5 TRUE equal to value and type true === 1 FALSE != not equal 5 != 4 TRUE > greater than 5 > 4 TRUE < less than 5 < 4 FALSE >= greater than or equal to 5 >= 5 TRUE <= less than or equal to 5 <= 5 TRUE == === http://www.w3schools.com/JS/js_comparisons.asp Thursday, September 10, 2009
26. logical operators operator meaning example result && and 5 == 5 && 4 != 6 TRUE || or 4 == 6 || 5 == 5 TRUE ! not !(5 == 4) TRUE Thursday, September 10, 2009
27. putting it all together Thursday, September 10, 2009
28. var a = 5; a += 3; a Thursday, September 10, 2009
29. var a = 5; a += 3; a // 8 Thursday, September 10, 2009
30. var a = 2; var b = 5; a * b; Thursday, September 10, 2009
31. var a = 2; var b = 5; a * b; // 10 Thursday, September 10, 2009
32. var a = 2; var b = 3; var c = a + b; var d = c * a; d Thursday, September 10, 2009
33. var a = 2; var b = 3; var c = a + b; var d = c * a; d // 10 Thursday, September 10, 2009
34. var blue = 'blue'; var red = 'red'; var colors = [blue, red]; colors Thursday, September 10, 2009
35. var blue = 'blue'; var red = 'red'; var colors = [blue, red]; colors // ["blue","red"] Thursday, September 10, 2009
36. var a = 5; a = 6; a = 7; a -= 2; a Thursday, September 10, 2009
37. var a = 5; a = 6; a = 7; a -= 2; a // 5 Thursday, September 10, 2009
38. var person = {name:'Peyton Manning'} person.name Thursday, September 10, 2009
39. var person = {name:'Peyton Manning'} person.name // "Peyton Manning" Thursday, September 10, 2009
40. var tv_shows = ['Wipeout', 'How I Met Your Mother', 'Big Bang Theory']; tv_shows[1] == 'How I Met Your Mother' Thursday, September 10, 2009
41. var tv_shows = ['Wipeout', 'How I Met Your Mother', 'Big Bang Theory']; tv_shows[1] == 'How I Met Your Mother' // true Thursday, September 10, 2009
42. var a = 5; var b = 4; var check = a == 5 && b == 3 check Thursday, September 10, 2009
43. var a = 5; var b = 4; var check = a == 5 && b == 3 check // false Thursday, September 10, 2009
44. var a = 5; var b = 4; var check = a == 3 || b > 3 check Thursday, September 10, 2009
45. var a = 5; var b = 4; var check = a == 3 || b > 3 check // true Thursday, September 10, 2009
46. var a = 5 - 1; a > 4 Thursday, September 10, 2009
47. var a = 5 - 1; a > 4 // false Thursday, September 10, 2009
48. time to program http://www.w3schools.com/JS/tryit.asp?filename=tryjs_intro + - * / % = == === != && || ! += -= /= *= Thursday, September 10, 2009