Ellak JavaScript Day

The history behind JS + intro to language structure, by Dimitris Michalakos and Elias Niaos.

Transcript

1. ΕΛ/ΛΑΚ JavaScript Day - Jan 29, 2016
10. Browser Wars: Round 1 – Fight!
11. Mosaic Air Mosaic Spyglass Mosaic Mosaic Netscape Internet Explorer Netscape Navigator Browser genealogy (early days)
12. 97% 68% 9% 0% 0% 0% 0% 0% 0% 0% 18% 54% 89,36% 80,45% 81,13% 59,67% 70% 64% 0% 0% 0% 3,76% 12,18% 12,13% 15,13% 22,70% 32,20% 0% 20% 40% 60% 80% 100% 120% 1994 Q1 1994 Q2 1995 Q1 1995 Q2 1996 Q2 1997 Q1 1997 Q2 1998 Q1 1998 Q2 Browser Usage 1994 Q1 – 1998 Q2 Mosaic Netscape Navigator Internet Explorer SOURCE: WWW USER SURVEY, GRAPHICS, VISUALIZATION & USABILITY CENTER, GEORGIA INSTITUTE OF TECHNOLOGY
14. Java Scheme Self Mocha LiveScript JavaScript 10 days Licensed by renamed renamed
18. European Computer Manufacturers Association EcmaScript
19. • Netscape Enterprise Server • Microsoft Internet Information Server (IIS) • Mozilla Rhino • Node.js JavaScript on the server Dec 1995
21. Why did JavaScript become so popular imo? 1. It’s everywhere 2. It’s easy (to begin with) 3. It has excellent async features This is Sparta
23. Values and types • Dynamic • Primitives & Object(s) • var • typeof
24. var a; typeof a; // "undefined" a = "hello world"; typeof a; // "string" a = 42; typeof a; // "number" a = true; typeof a; // "boolean" a = { a: "hello world", b: 42, c: true }; typeof a; // "object" a = undefined; typeof a; // "undefined" a = { b: "c" }; typeof a; // "object"
25. Values and types (2) • Hoisting • Coercion • Boxing
26. var a = 2; foo(); // works because `foo()` // declaration is "hoisted" function foo() { a = 3; console.log( a ); // 3 var a; // declaration is "hoisted" // to the top of `foo()` } console.log( a ); // 2
27. var a = "42"; var b = Number( a ); // explicitly coerced here a; // "42" b; // 42 -- the number! var a = "42"; var b = a * 1; // "42" implicitly coerced to 42 here a; // "42" b; // 42 -- the number!
28. var a = "abc"; a.length; // 3 a.toUpperCase(); // "ABC" var a = new String( "abc" ); // Manually boxing var b = new Number( 42 ); var c = new Boolean( true ); a.valueOf(); // "abc" b.valueOf(); // 42 c.valueOf(); // true b = a + ""; // ‘b’ has the unboxed primitive value "abc" typeof a; // "object" typeof b; // "string"
29. Just a few more things • Function • Scope • Closure
30. function foo() { return 42; } foo.bar = "hello world"; typeof foo; // "function" typeof foo(); // "number" typeof foo.bar; // "string“ function foo(a) { console.log( a + b ); } var b = 2; foo( 2 ); // 4
31. function makeAdder(x) { return function(y) { return x + y; }; } var add5 = makeAdder(5); var add10 = makeAdder(10); console.log(add5(2)); // 7 console.log(add10(2)); // 12