Successfully reported this slideshow.

Variables Assignment And Operators

1 323 vues

Publié le

Introduction to variables, assignment and operators in JavaScript.

Publié dans : Technologie, Business
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Variables Assignment And Operators

  1. 1. variables, assignment and operators Thursday, September 10, 2009
  2. 2. variables containers to store information that can be used later http://www.w3schools.com/JS/js_variables.asp Thursday, September 10, 2009
  3. 3. Remember Algebra? 5=x+3 Thursday, September 10, 2009
  4. 4. var var a; var age = 5; var name = 'John Nunemaker'; Thursday, September 10, 2009
  5. 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. 6. undeclared variables automatically declare, but don’t do this x = 10; foo = 'bar'; x // 10 foo // "bar" Thursday, September 10, 2009
  7. 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. 8. naming variables case sensitive var car = 'Ford'; var cAr = 'Toyota'; car // "Ford" cAr // "Toyota" Thursday, September 10, 2009
  9. 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. 10. naming variables can be short or descriptive var x; // short var field; // descriptive Thursday, September 10, 2009
  11. 11. naming variables separate words with underscores var section_field_name; // good idea var sectionfieldname; // bad idea Thursday, September 10, 2009
  12. 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. 13. (pause for review and applause) Thursday, September 10, 2009
  14. 14. good or bad? var section; Thursday, September 10, 2009
  15. 15. good or bad? var section; Thursday, September 10, 2009
  16. 16. good or bad? var 10thingsihateaboutyou; Thursday, September 10, 2009
  17. 17. good or bad? var 10thingsihateaboutyou; variables cannot start with numbers and should have underscores between words Thursday, September 10, 2009
  18. 18. good or bad? var fieldname; Thursday, September 10, 2009
  19. 19. good or bad? var fieldname; Should be: var field_name; Thursday, September 10, 2009
  20. 20. good or bad? var section_field_name; Thursday, September 10, 2009
  21. 21. good or bad? var section_field_name; Thursday, September 10, 2009
  22. 22. operators assignment and comparison http://www.w3schools.com/JS/js_operators.asp Thursday, September 10, 2009
  23. 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. 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. 25. comparison operators http://www.w3schools.com/JS/js_comparisons.asp operator meaning example result == equal to value 5 == 5 TRUE equal to value === true === 1 FALSE and type != not equal 5 != 4 TRUE > greater than 5>4 TRUE < less than 5<4 FALSE greater than >= 5 >= 5 TRUE or equal to less than <= 5 <= 5 TRUE or equal to Thursday, September 10, 2009
  26. 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. 27. putting it all together Thursday, September 10, 2009
  28. 28. var a = 5; a += 3; a Thursday, September 10, 2009
  29. 29. var a = 5; a += 3; a // 8 Thursday, September 10, 2009
  30. 30. var a = 2; var b = 5; a * b; Thursday, September 10, 2009
  31. 31. var a = 2; var b = 5; a * b; // 10 Thursday, September 10, 2009
  32. 32. var a = 2; var b = 3; var c = a + b; var d = c * a; d Thursday, September 10, 2009
  33. 33. var a = 2; var b = 3; var c = a + b; var d = c * a; d // 10 Thursday, September 10, 2009
  34. 34. var blue = 'blue'; var red = 'red'; var colors = [blue, red]; colors Thursday, September 10, 2009
  35. 35. var blue = 'blue'; var red = 'red'; var colors = [blue, red]; colors // ["blue","red"] Thursday, September 10, 2009
  36. 36. var a = 5; a = 6; a = 7; a -= 2; a Thursday, September 10, 2009
  37. 37. var a = 5; a = 6; a = 7; a -= 2; a // 5 Thursday, September 10, 2009
  38. 38. var person = {name:'Peyton Manning'} person.name Thursday, September 10, 2009
  39. 39. var person = {name:'Peyton Manning'} person.name // "Peyton Manning" Thursday, September 10, 2009
  40. 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. 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. 42. var a = 5; var b = 4; var check = a == 5 && b == 3 check Thursday, September 10, 2009
  43. 43. var a = 5; var b = 4; var check = a == 5 && b == 3 check // false Thursday, September 10, 2009
  44. 44. var a = 5; var b = 4; var check = a == 3 || b > 3 check Thursday, September 10, 2009
  45. 45. var a = 5; var b = 4; var check = a == 3 || b > 3 check // true Thursday, September 10, 2009
  46. 46. var a = 5 - 1; a > 4 Thursday, September 10, 2009
  47. 47. var a = 5 - 1; a > 4 // false Thursday, September 10, 2009
  48. 48. time to program + - * / % = == === != && || ! += -= /= *= http://www.w3schools.com/JS/tryit.asp?filename=tryjs_intro Thursday, September 10, 2009

×