Upload
john-nunemaker
View
1.456
Download
2
Tags:
Embed Size (px)
DESCRIPTION
Introduction to variables, assignment and operators in JavaScript.
Citation preview
variables, assignment and operators
Thursday, September 10, 2009
variablescontainers to store information
that can be used laterhttp://www.w3schools.com/JS/js_variables.asp
Thursday, September 10, 2009
Remember Algebra?5 = x + 3
Thursday, September 10, 2009
varvar a;var age = 5;var name = 'John Nunemaker';
Thursday, September 10, 2009
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
undeclared variablesautomatically declare, but don’t do this
x = 10;foo = 'bar';
x // 10foo // "bar"
Thursday, September 10, 2009
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
naming variablescase sensitive
var car = 'Ford';var cAr = 'Toyota';
car // "Ford"cAr // "Toyota"
Thursday, September 10, 2009
naming variablesmust begin with letter or underscore
var car; // good!var car9; // good!var _car; // good!var 9car; // bad! SyntaxError
Thursday, September 10, 2009
naming variablescan be short or descriptive
var x; // shortvar field; // descriptive
Thursday, September 10, 2009
naming variablesseparate words with underscores
var section_field_name; // good ideavar sectionfieldname; // bad idea
Thursday, September 10, 2009
naming variablesgeneral formatting rules for easier reading
var age = 15; // good ideavar age=15; // bad ideavar age = 15; // bad idea
Thursday, September 10, 2009
(pause for review and applause)
Thursday, September 10, 2009
good or bad?var section;
Thursday, September 10, 2009
good or bad?var section;
Thursday, September 10, 2009
good or bad?var 10thingsihateaboutyou;
Thursday, September 10, 2009
good or bad?var 10thingsihateaboutyou;
variables cannot start with numbers and should have underscores between words
Thursday, September 10, 2009
good or bad?var fieldname;
Thursday, September 10, 2009
good or bad?var fieldname;
Should be: var field_name;
Thursday, September 10, 2009
good or bad?var section_field_name;
Thursday, September 10, 2009
good or bad?var section_field_name;
Thursday, September 10, 2009
operatorsassignment and comparison
http://www.w3schools.com/JS/js_operators.asp
Thursday, September 10, 2009
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
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
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
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
putting it all together
Thursday, September 10, 2009
var a = 5;a += 3;a
Thursday, September 10, 2009
var a = 5;a += 3;a // 8
Thursday, September 10, 2009
var a = 2;var b = 5;a * b;
Thursday, September 10, 2009
var a = 2;var b = 5;a * b; // 10
Thursday, September 10, 2009
var a = 2;var b = 3;var c = a + b;var d = c * a;d
Thursday, September 10, 2009
var a = 2;var b = 3;var c = a + b;var d = c * a;d // 10
Thursday, September 10, 2009
var blue = 'blue';var red = 'red';var colors = [blue, red];colors
Thursday, September 10, 2009
var blue = 'blue';var red = 'red';var colors = [blue, red];colors // ["blue","red"]
Thursday, September 10, 2009
var a = 5;a = 6;a = 7;a -= 2;a
Thursday, September 10, 2009
var a = 5;a = 6;a = 7;a -= 2;a // 5
Thursday, September 10, 2009
var person = {name:'Peyton Manning'}person.name
Thursday, September 10, 2009
var person = {name:'Peyton Manning'}person.name // "Peyton Manning"
Thursday, September 10, 2009
var tv_shows = ['Wipeout', 'How I Met Your Mother', 'Big Bang Theory'];tv_shows[1] == 'How I Met Your Mother'
Thursday, September 10, 2009
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
var a = 5;var b = 4;var check = a == 5 && b == 3check
Thursday, September 10, 2009
var a = 5;var b = 4;var check = a == 5 && b == 3check // false
Thursday, September 10, 2009
var a = 5;var b = 4;var check = a == 3 || b > 3check
Thursday, September 10, 2009
var a = 5;var b = 4;var check = a == 3 || b > 3check // true
Thursday, September 10, 2009
var a = 5 - 1;a > 4
Thursday, September 10, 2009
var a = 5 - 1;a > 4 // false
Thursday, September 10, 2009
time to program
http://www.w3schools.com/JS/tryit.asp?filename=tryjs_intro
+ - * / % = == === != && || ! += -= /= *=
Thursday, September 10, 2009