48
variables, assignment and operators Thursday, September 10, 2009

Variables Assignment And Operators

Embed Size (px)

DESCRIPTION

Introduction to variables, assignment and operators in JavaScript.

Citation preview

Page 1: Variables Assignment And Operators

variables, assignment and operators

Thursday, September 10, 2009

Page 2: Variables Assignment And Operators

variablescontainers to store information

that can be used laterhttp://www.w3schools.com/JS/js_variables.asp

Thursday, September 10, 2009

Page 3: Variables Assignment And Operators

Remember Algebra?5 = x + 3

Thursday, September 10, 2009

Page 4: Variables Assignment And Operators

varvar a;var age = 5;var name = 'John Nunemaker';

Thursday, September 10, 2009

Page 5: Variables Assignment And Operators

declaring variablesonly need var once, but multiple times won’t hurt you

// goodvar age = 15;age // 15age = 16;age // 16age = 17;age // 17

// no pointvar age = 15;age // 15var age = 16;age // 16var age = 17;age // 17

Thursday, September 10, 2009

Page 6: Variables Assignment And Operators

undeclared variablesautomatically declare, but don’t do this

x = 10;foo = 'bar';

x // 10foo // "bar"

Thursday, September 10, 2009

Page 7: Variables Assignment And Operators

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

Page 8: Variables Assignment And Operators

naming variablescase sensitive

var car = 'Ford';var cAr = 'Toyota';

car // "Ford"cAr // "Toyota"

Thursday, September 10, 2009

Page 9: Variables Assignment And Operators

naming variablesmust begin with letter or underscore

var car; // good!var car9; // good!var _car; // good!var 9car; // bad! SyntaxError

Thursday, September 10, 2009

Page 10: Variables Assignment And Operators

naming variablescan be short or descriptive

var x; // shortvar field; // descriptive

Thursday, September 10, 2009

Page 11: Variables Assignment And Operators

naming variablesseparate words with underscores

var section_field_name; // good ideavar sectionfieldname; // bad idea

Thursday, September 10, 2009

Page 12: Variables Assignment And Operators

naming variablesgeneral formatting rules for easier reading

var age = 15; // good ideavar age=15; // bad ideavar age = 15; // bad idea

Thursday, September 10, 2009

Page 13: Variables Assignment And Operators

(pause for review and applause)

Thursday, September 10, 2009

Page 14: Variables Assignment And Operators

good or bad?var section;

Thursday, September 10, 2009

Page 15: Variables Assignment And Operators

good or bad?var section;

Thursday, September 10, 2009

Page 16: Variables Assignment And Operators

good or bad?var 10thingsihateaboutyou;

Thursday, September 10, 2009

Page 17: Variables Assignment And Operators

good or bad?var 10thingsihateaboutyou;

variables cannot start with numbers and should have underscores between words

Thursday, September 10, 2009

Page 18: Variables Assignment And Operators

good or bad?var fieldname;

Thursday, September 10, 2009

Page 19: Variables Assignment And Operators

good or bad?var fieldname;

Should be: var field_name;

Thursday, September 10, 2009

Page 20: Variables Assignment And Operators

good or bad?var section_field_name;

Thursday, September 10, 2009

Page 21: Variables Assignment And Operators

good or bad?var section_field_name;

Thursday, September 10, 2009

Page 22: Variables Assignment And Operators

operatorsassignment and comparison

http://www.w3schools.com/JS/js_operators.asp

Thursday, September 10, 2009

Page 23: Variables Assignment And Operators

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

Page 24: Variables Assignment And Operators

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

Page 25: Variables Assignment And Operators

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 to5 <= 5 TRUE

==

===

http://www.w3schools.com/JS/js_comparisons.asp

Thursday, September 10, 2009

Page 26: Variables Assignment And Operators

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

Page 27: Variables Assignment And Operators

putting it all together

Thursday, September 10, 2009

Page 28: Variables Assignment And Operators

var a = 5;a += 3;a

Thursday, September 10, 2009

Page 29: Variables Assignment And Operators

var a = 5;a += 3;a // 8

Thursday, September 10, 2009

Page 30: Variables Assignment And Operators

var a = 2;var b = 5;a * b;

Thursday, September 10, 2009

Page 31: Variables Assignment And Operators

var a = 2;var b = 5;a * b; // 10

Thursday, September 10, 2009

Page 32: Variables Assignment And Operators

var a = 2;var b = 3;var c = a + b;var d = c * a;d

Thursday, September 10, 2009

Page 33: Variables Assignment And Operators

var a = 2;var b = 3;var c = a + b;var d = c * a;d // 10

Thursday, September 10, 2009

Page 34: Variables Assignment And Operators

var blue = 'blue';var red = 'red';var colors = [blue, red];colors

Thursday, September 10, 2009

Page 35: Variables Assignment And Operators

var blue = 'blue';var red = 'red';var colors = [blue, red];colors // ["blue","red"]

Thursday, September 10, 2009

Page 36: Variables Assignment And Operators

var a = 5;a = 6;a = 7;a -= 2;a

Thursday, September 10, 2009

Page 37: Variables Assignment And Operators

var a = 5;a = 6;a = 7;a -= 2;a // 5

Thursday, September 10, 2009

Page 38: Variables Assignment And Operators

var person = {name:'Peyton Manning'}person.name

Thursday, September 10, 2009

Page 39: Variables Assignment And Operators

var person = {name:'Peyton Manning'}person.name // "Peyton Manning"

Thursday, September 10, 2009

Page 40: Variables Assignment And Operators

var tv_shows = ['Wipeout', 'How I Met Your Mother', 'Big Bang Theory'];tv_shows[1] == 'How I Met Your Mother'

Thursday, September 10, 2009

Page 41: Variables Assignment And Operators

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

Page 42: Variables Assignment And Operators

var a = 5;var b = 4;var check = a == 5 && b == 3check

Thursday, September 10, 2009

Page 43: Variables Assignment And Operators

var a = 5;var b = 4;var check = a == 5 && b == 3check // false

Thursday, September 10, 2009

Page 44: Variables Assignment And Operators

var a = 5;var b = 4;var check = a == 3 || b > 3check

Thursday, September 10, 2009

Page 45: Variables Assignment And Operators

var a = 5;var b = 4;var check = a == 3 || b > 3check // true

Thursday, September 10, 2009

Page 46: Variables Assignment And Operators

var a = 5 - 1;a > 4

Thursday, September 10, 2009

Page 47: Variables Assignment And Operators

var a = 5 - 1;a > 4 // false

Thursday, September 10, 2009

Page 48: Variables Assignment And Operators

time to program

http://www.w3schools.com/JS/tryit.asp?filename=tryjs_intro

+ - * / % = == === != && || ! += -= /= *=

Thursday, September 10, 2009