http://proglit.com/. the javascript language by sa
TRANSCRIPT
![Page 1: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/1.jpg)
http://proglit.com/
![Page 2: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/2.jpg)
the javascriptlanguage
![Page 3: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/3.jpg)
BY
SA
![Page 4: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/4.jpg)
![Page 5: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/5.jpg)
Javascriptis notJava
![Page 6: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/6.jpg)
• Brendan Eich at Netscape in 1995• named in deal between Netscape and Sun
• ECMA standard calls it ECMAScript
![Page 7: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/7.jpg)
• only language in all modern web browsers• currently focus of lots of optimization work
![Page 8: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/8.jpg)
the DOM(Document Object Model, the hierarchy of objects
representing page content in web browsers)
AJAX(Asynchronous Javascript and XML, a technique to submit/request data without refreshing the page)
![Page 9: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/9.jpg)
dynamic and (a little) functional
object-oriented programmingvia prototyping
![Page 10: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/10.jpg)
numbersbooleansstringsarrays (lists)objects (dictionaries)functionsnull
![Page 11: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/11.jpg)
http://proglit.com/
![Page 12: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/12.jpg)
+ addition- subtraction/negation/ division* multiplication% modulus
![Page 13: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/13.jpg)
x * 3 + 9((x * 3) + 9)
(+ (* x 3) 9)
![Page 14: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/14.jpg)
foo(a, b, c)bar()
(foo a b c)(bar)
![Page 15: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/15.jpg)
foo(foo)
((foo))
foo
foo()(foo())
(foo)
![Page 16: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/16.jpg)
foo = bar / 2(foo = (bar / 2))
(= foo (/ bar 2))
lvalue rvalue
![Page 17: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/17.jpg)
x = y = z = 4 + 2(x = (y = (z = (4 + 2))))(((x = y) = z) = (4 + 2))
the = operator is right-to-left associative
![Page 18: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/18.jpg)
http://proglit.com/
![Page 19: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/19.jpg)
x = 3;cow = 2 + x;foo(1);rat = bar();
![Page 20: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/20.jpg)
free-form syntaxx = 3; x=3 ; x = 3 ;
![Page 21: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/21.jpg)
foo(); // ignore this
/* ignore all this too */ bar();
![Page 22: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/22.jpg)
/* apple /* banana orange */ lemon */
![Page 23: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/23.jpg)
_foofoo_bar$foo
foo$bar
![Page 24: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/24.jpg)
varvar name;
var name = expression;
var monkey;var zebra = 3;
![Page 25: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/25.jpg)
var jeff;foo(jeff); // OKfoo(amanda); // error
undefined
![Page 26: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/26.jpg)
function
function(parameters) {body}
![Page 27: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/27.jpg)
var helen = function(apple, orange) {
return apple + orange;};
var dan = helen(3, 5);
![Page 28: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/28.jpg)
! not=== equals!== not equals&& and|| or< less than> greater than<= less than or equal>= greater than or equal
![Page 29: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/29.jpg)
!true // false!false // true!null // true!0 // true!“” // true!undefined // true
![Page 30: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/30.jpg)
3 === 3 // true3 === -2 // false!true === false // true
![Page 31: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/31.jpg)
(3 === 3) || (2 > 4) // true
![Page 32: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/32.jpg)
http://proglit.com/
![Page 33: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/33.jpg)
if / elseif (condition) {body}else if (condition) {body}else {body}
whilewhile (condition) {body}
![Page 34: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/34.jpg)
if (x === 3) { foo();} else { bar();}
![Page 35: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/35.jpg)
var i = 0;while (i < 5) { foo(); i = i + 1;}
![Page 36: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/36.jpg)
var foo = function() {
return bar;};foo(); // errorvar bar = 3;foo(); // OK
![Page 37: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/37.jpg)
var foo = function() {
bar = 6;return bar;var bar;
};foo(); // 6
![Page 38: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/38.jpg)
nested functionsvar foo = function(a) {
var bar = function(b) {return b + 3;
};return bar(a);
};foo(5); // 8
![Page 39: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/39.jpg)
Function A C
Function A D
Function B E
B
A D
CB
C
![Page 40: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/40.jpg)
var foo = function(a) {var bar = function(a) {
return a + 3;};return bar(a);
};foo(5); // 8
![Page 41: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/41.jpg)
var foo = function() {var a = 3;var bar = function(b) {
return a + b;};a = 5;return bar(6);
};foo(); // 11
![Page 42: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/42.jpg)
http://proglit.com/
![Page 43: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/43.jpg)
var foo = function(a) {var b = 4;return function(c) {
return a + b + c;};
};var bar = foo(2);var ack = foo(3);bar(6); // 12ack(6); // 13
closure
![Page 44: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/44.jpg)
var foo = function(a) {return function() {
a = a + 2;return a;
};};var bar = foo(2);var ack = foo(3);bar(); // 4bar(); // 6ack(); // 5
closure
![Page 45: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/45.jpg)
objects
{properties}
object[string]
![Page 46: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/46.jpg)
var foo = {};var bar = {“bill”: 1 + 1, “diana”: 11};var ack = bar[“bill”]; // 2bar[“bill”] = 3; foo[“ned”] = 8; ack = foo[“ted”]; // undefined
![Page 47: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/47.jpg)
var foo = {};var bar = {bill: 1 + 1, diana: 11};var ack = bar.bill; // 2bar.bill = 3;foo.ned = 8; ack = foo.ted; // undefined
![Page 48: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/48.jpg)
methodsvar foo = {};foo.bar = function() {
this.ack = 3;};foo.bar();
![Page 49: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/49.jpg)
var foo = {};foo.bar = function(x) {
x.ack = 3;};foo.bar(foo);
![Page 50: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/50.jpg)
var foo = {};foo.bar = function() {
this = 3; //error};foo.bar();
![Page 51: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/51.jpg)
var bar = function() {return this;
};bar(); // global object passed to this
![Page 52: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/52.jpg)
http://proglit.com/
![Page 53: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/53.jpg)
object linksobject A C
object A D
object B E
B
A D
CB
C
![Page 54: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/54.jpg)
var foo = {a: 1, b: 2, c: 3};var bar = {a: 4, d: 5};var ack = {b: 6, e: 7};… // foo bar ackvar x = foo.c === bar.c === ack.c; // truebar.c = 8;x = ack.c; // 8x = foo.c; // 3
![Page 55: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/55.jpg)
var foo = “hello”;var x = foo.length; // 5x = foo.charAt(1) ; // “e”x = “avast”.charAt(3) ; // “s”
![Page 56: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/56.jpg)
object charAt
“avast” length charAt “hello” length charAt
![Page 57: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/57.jpg)
var Tom = function(foo, bar) {
this.foo = foo;this.bar = bar;
};var jane = (new Tom(2, 3));var david = new Tom(7, 10);
![Page 58: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/58.jpg)
var Tom = function(foo, bar) {this.foo = foo;this.bar = bar;
};Tom.prototype.ack = “hello”;var jane = new Tom(2, 3);var x = jane.ack; // “hello”
object ack object foo ackbar
![Page 59: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/59.jpg)
http://proglit.com/
![Page 60: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/60.jpg)
arrays
[items]
array[index]
![Page 61: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/61.jpg)
var foo = [];var bar = [4, “hello”, 33];var ack = bar[2]; // 33bar[3] = “orange”;
![Page 62: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/62.jpg)
var foo = [];var bar = [4, “hello”, 33];var ack = bar[“2”]; // 33bar[“3”] = “orange”;
![Page 63: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/63.jpg)
var foo = [];var bar = [4, “hello”, 33];var ack = foo.length; // 0ack = bar.length; // 3bar[15] = true;ack = bar.length; // 16ack = bar[8]; // undefined
![Page 64: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/64.jpg)
argumentsvar foo = function(a, b, c) {
// arguments[0] equals a// arguments[1] equals b// arguments[2] equals c…
};
![Page 65: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/65.jpg)
var foo = function(a, b, c) { … };
foo(1, 7, 11, 2, 8); // OKfoo(6, 7); // OK
![Page 66: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/66.jpg)
var sum = function() {var i = 0;var sum = 0;while (i < arguments.length) {
sum = sum + arguments[i];i = i + 1;
}return sum;
};
sum(2, 2, 3); // 7sum(5, 7); // 12sum(); // 0
![Page 67: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/67.jpg)
http://proglit.com/
![Page 68: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/68.jpg)
exceptions
foo(“hello” * true);
![Page 69: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/69.jpg)
exceptionstry {
foo(“hello” * true);bar();
} catch (ex) {ack(ex);
}
![Page 70: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/70.jpg)
try {throw “We’re
screwed.”;bar();
} catch (ex) {ack(ex);
}
![Page 71: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/71.jpg)
var foo = function () { … // exception
};
foo(); // exception
![Page 72: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/72.jpg)
try { foo(); // exceptionbar();
} catch (ex) {ack();
}
![Page 73: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/73.jpg)
var bar = function() {try {
foo(); // exception} catch (ex) {
ack();}foo(); // exception
};
bar(); // exception
![Page 74: Http://proglit.com/. the javascript language BY SA](https://reader031.vdocuments.mx/reader031/viewer/2022020102/56649c535503460f948fd028/html5/thumbnails/74.jpg)
http://proglit.com/