07 - Javascript - OpenWebSchool

Transcript

1. JavaScript
2. Brendan Eich
3. “I had to be done in ten days or something worse than JS would have happened”
4. Netscape 找他來幫網頁弄個程式語言 1995
5. Netscape 當時與 Sun 合作 從 LiveScript 更名為 JavaScript 1995
6. 跟 Java 一點關係都沒有
7. 送交 ECMA 國際 標準化成 ECMAScript 1996
8. 直譯式語言 但現在速度已經不輸編譯式語言 :P
9. 環境獨立 語言規範沒有輸入輸出 由執行環境提供
10. 物件導向 原型繼承 不是用 Class 的意思
11. Lisp in C's Clothing 骨子裡是函數式語言，他爸是 Scheme
12. 變數
13. var a; // undefined
14. undefined 未初始化
15. var a = 4; // 4 a = banana; // undefined a = 6; // 6
16. var a = 4; // 4 a = ‘hello’; // ‘hello’
17. 動態型別 擁有型別的是值，不是變數
18. 型別
19. Array Object Function Number String Boolean
20. 數字
22. 64 位元雙精浮點數
23. 運算子都跟 C 的一樣的樣子
24. Math 野生的物件
25. Math.sin(0); // 0 Math.round(1.5); // 2 Math.random(); // 0.11533094733022153 Math.PI; // 3.14159265....
26. parseInt parseFloat 少數幾個野生的內建函式
27. parseInt(‘5’, 10); // 5 parseInt(‘hello’, 10); // NaN
28. NaN Not a Number
29. 字串
30. ‘Hello’ “Hello”
31. ‘hello’ + ‘ world’ // ‘hello world’ ‘hello’ + 42 // ‘hello42’ 42 + ‘hello’ // ‘42hello’
32. ‘hello’.length // 5 ‘hello’.toUpperCase() // ‘HELLO’ ‘hello’.substring(1, 3) // ‘el’
33. 布林
34. true false
35. 42 == 42 // true 42 != 42 // false 42 == ’42’ // true
36. Equality Operators 內容相等就好 :P
37. NaN == NaN // false
38. Identity Operators 連型別都要相等
39. 42 === 42 // true 42 === ’42’ // false
40. 列表
41. [42, 5, 23]
42. [42, true, ‘hello’]
43. [1, 2, 3, 4].length // 4 [1, 2, 3, 4][0] // 1 [1, 2, 3, 4][99] // undefined
44. var a = [1, 2, 3, 4]; a[2] = ‘banana’; // [1, ‘banana’, 3, 4]
45. var a = [1, 2, 3, 4]; typeof a; // ‘object’ Array.isArray(a); // true
46. var a = [1, 5, 2, 4].pop(); // 4 // a === [1, 5, 2] a.sort(); // [1, 2, 5]
47. 物件
48. { name: ‘Bob’ }
49. { name: ‘Bob’, age: 4 }
50. { name: ‘Bob’, age: 4 }.name; // ‘Bob’ { name: ‘Bob’, age: 4 }[‘name’]; // ‘Bob’ { name: ‘Bob’, age: 4 }.banana; // undefined
51. var obj = { name: ‘Bob’, age: 4 }; obj.name = ‘Alice’; // obj === { name: ‘Alice’, age: 4 } obj[‘name’] = ‘Alice’; // obj === { name: ‘Alice’, age: 4 }
52. var obj = { name: ‘Bob’, age: 4 }; delete obj.name; // obj === { age: 4 }
53. var obj = { name: ‘Bob’, age: 4 }; delete obj.name; // obj === { age: 4 }
54. Null 沒有東西存在的意思
55. typeof null; // ‘object’
56. JSON
57. JavaScript Object Notaion
58. 目前最流行的資料交換格式之一
59. Douglas Crockford
60. { ‘name’: ‘Bob’, ’age’: 4, ‘pet’: { ‘dog’: [‘Bob’, ‘Cob’], ‘cat’: [‘Dub’] }, ‘dead’: false }
61. 函數
62. function (a) { return a; }
63. var f = function () {};
64. 函數是一種值 函數式語言優良血統
65. var two = function () { return 2; }; two; // function () { return 2; } two(); // 2
66. var cakeRecipe = function (ingredient) { return ingredient + ‘ cake’; }; var cookieRecipe = function (ingredient) { return ingredient + ‘ cookie’; }; cookieRecipe(‘chocolate’); // chocolate cookie
67. var cook = function (recipe, ingredient) { return recipe(ingredient); }; cook(cakeRecipe, ‘chocolate’); // chocolate cake cook(cookieRecipe, ‘chocolate’); // chocolate cookie
68. cook(function (ingredient) { return ingredient + ‘ icecream’ }, ‘banana’); // banana icecream
69. var parser = function (base) { return function (x) { return parseInt(x, base); }; }; var parseBin = parser(2); parseBin(‘1010’); // 10
70. var f = function () { return arguments[1]; }; f(2, 3, true, { foo: ‘bar’ }); // 3
71. 流程控制
72. 好像跟 C 一樣呵呵
73. for (var i = 0; i < 5; i++) { // 做五次 }
74. var obj = { name: ‘Bob’, age: 4 }; ‘name’ in obj; // true ‘banana’ in obj; // false
75. for (var prop in obj) { return obj.prop; } // ‘Bob’, 42
76. Scope
77. 和 C 不一樣的地方在於
78. JS 的大括號不會形成 scope 只有函數的才會形成 scope
79. if (true) { var a = 4; } a; // 4
80. var f = function () { var a = 4; }; f(); a; // undefined
81. 列表迭代 A_A
82. var a = [1, 2, 3]; for (var i = 0, len = a.length; i < len; i++) { a[i]; // 1, 2, 3 ... }
83. var a = [1, 2, 3]; a.forEach(function (n, i, array) { n; // 1, 2, 3; });
84. var a = [1, 2, 3]; var b = a.map(function (n) { return n * 2; }); b; // [2, 4, 6]
85. var b = [1, 2, 3].filter(function (n) { return n < 3; }); b; // [1, 2]
86. var add = function (a, b) { return a + b; }; [1, 2, 3].reduce(add, 0); // 6