JS (2 of 4)

Transcript

1. Javascript
2. Javascript Объектно-ориентированный язык с утиной типизацией, прототипным наследованием и наследуемой областью видимости
3. Javascript Объектно-ориентированный язык
4. Javascript Объектно-ориентированный язык var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
5. Свойства var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
6. Свойства Методы — тоже свойства. var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
7. Свойства Методы — тоже свойства. И элементы массива — тоже. var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
8. Аксессоры var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
9. Аксессоры [ ] и . равноправны var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2
10. Аксессоры [ ] и . равноправны var myArray = new Array(); myArray[0] = 1; myArray.push(2); console.log(myArray.length); // 2 var myArray = new Array(); myArray[0] = 1; myArray["push"](2); console["log"](myArray["length"]); // 2
11. Лирическое отступление < >
12. var myObject = { foo: 42; }; var propertyName = "foo"; /* ... */ eval("myObject." + foo); // 42
13. var myObject = { foo: 42; }; var propertyName = "foo"; /* ... */ eval("myObject." + foo); // 42 myObject[foo]; // 42
14. </ >
15. Свойства [1,2,3].length; // 3 "abc".length; // 3 /regExp/.source; // "regExp" Методы [1,2,3].push(4); "abc".toUpperCase(); /regExp/.exec("str");
16. Свойства [1,2,3].length; // 3 "abc".length; // 3 /regExp/.source; // "regExp" Методы [1,2,3].push(4); "abc".toUpperCase(); /regExp/.exec("str"); Методы — это тоже свойства, только функции, больше никаких отличий нет.
17. Постойте, если свойства есть у всего, то В JavaScript всё — объекты
18. В JavaScript всё — объекты
19. Типы Object объекты Array Function RegExp Arguments string примитивы number boolean undefined null
20. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12
21. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s — Cвойство «length»?
22. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s — Cвойство «length»? — Это примитив, у них не бывает свойств.
23. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s — Cвойство «length»? — Это примитив, у них не бывает свойств. — Тогда преобразуй в объект!
24. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s [object String]
25. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s [object String] — Cвойство «length»?
26. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s [object String] — Cвойство «length»? — 12
27. При необходимости примитивы преобразуются в объекты. var str = "Hello world!"; str.length; // 12 string s
28. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined ???
29. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s — Установи свойство «foo» равное 42!
30. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s — Установи свойство «foo» равное 42! — Это примитив, у них не бывает свойств.
31. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s — Установи свойство «foo» равное 42! — Это примитив, у них не бывает свойств. — Преобразуй в объект!
32. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s [object String]
33. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s [object String] foo: 42 — Установи свойство «foo» равное 42! — OK
34. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s [object String] foo: 42 — Свойство «foo»? — Это примитив. — Преобразуй в объект!
35. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s [object String] foo: 42 — Свойство «foo»? — Нет такого. [object String]
36. Присваивать примитивам свойства бесполезно. var str = "Hello world!"; str.foo = 42; str.foo; // undefined string s
37. Преобразования в объект Object объекты Object Array Array Function Function RegExp RegExp Arguments Arguments string примитивы String number Number boolean Boolean undefined — null —
38. Преобразования в объект Undefined и Null не преобразуются в объекты null.foo; // [TypeError] undefined.foo; // [TypeError]
39. Преобразования в объект Можно преобразовать вручную new String("foo"); // [object String] new Number(42); // [object Number] new Boolean(true); // [object Boolean]
40. < >
41. Без маньячеств! Не стоит использовать примитивы в качестве объектов для ускорения работы.
42. </ >
43. Примитивы присваиваются по значению var myNumber = 42; var myOtherNumber = myNumber; myOtherNumber++; myOtherNumber; // 43 myNumber; // 42
44. Примитивы передаются по значению function increment(n){ n++; }; var myNumber = 42; increment(myNumber); myNumber; // 42
45. Объекты присваиваются по ссылке var myObject = {}; var myOtherObject = myObject; myOtherObject.foo = 42; myOtherObject.foo; // 42 myObject.foo; // 42
46. Объекты передаются по ссылке function fooize(o){ o.foo = 42; }; var myObject = {}; fooize(myObject); myObject.foo; // 42
47. this var o = {}; o.setFoo = function(fooValue){ this.foo = fooValue; }; o.setFoo(42); o.foo; // 42
48. this В JavaScript this указывает на тот объект, на котором метод был вызван, а не тот, на котором определен.
49. this var array1 = []; var array2 = []; array1.add = function(value){ this.push(value); }; array2.add = array1.add; array2.add(42); array1; // [] array2; // [42]
50. this Чтобы применить функцию (метод), не обязательно её присваивать объекту. var array1 = []; var array2 = []; array1.add = function(value){ this.push(value); }; array1.add.call(array2, 42); array1; // [] array2; // [42]
51. this Чтобы применить функцию (метод), не обязательно её присваивать объекту. var array1 = []; var array2 = []; array1.add = function(value){ this.push(value); }; array1.add.apply(array2, [42]); array1; // [] array2; // [42]
52. [[class]] У каждого объекта есть внутреннее свойство [[class]]. ({}).toString(); // "[object Object]" ({}).toString.call([]); // "[object Array]" ({}).toString.call( function(){} ); // "[object Function]" ({}).toString.call( document.createElement("div") ); // "[object HTMLDivElement]"
53. Javascript Объектно-ориентированный язык с утиной типизацией, прототипным наследованием и наследуемой областью видимости
54. Утиная типизация
55. Утиная типизация Значения автоматически приводятся к нужному типу, когда это необходимо. Только когда необходимо, сама по себе, внезапно, переменная тип поменять не может.
56. Приведение к boolean var foo = Boolean(bar); var foo = !!bar;
57. Приведение к boolean Любой объект всегда приводится к true. Число приводится к false если равно ±0 или NaN. В остальных случаях — true. Пустая строка приводится к false. Остальные — к true. undefined и null приводятся к false.
58. Приведение к boolean Любой объект всегда приводится к true. var foo = new Boolean(false); foo; // [object Boolean] Boolean(foo); // true if (new Boolean(false)){ console.log("truthy"); // "truthy" }
59. Приведение к string var foo = String(bar); var foo = "" + bar;
60. Приведение к string У объектов вызывается метод valueOf(). Если valueOf() вернул не примитив, вызывается toString(). ({valueOf: function(){ return "foo"; }}) + "bar"; // "foobar"
61. Приведение к number var foo = Number(bar); var foo = +bar;
62. Приведение к number У объекта сначала вызывается valueOf(), иначе toString(). true приводится к 1. false приводится к 0. null приводится к 0. undefined приводится к NaN
63. Приведение к number Пустая строка приводится к 0. "Infinity", "+Infinity", "-Infinity" к ±∞. Строки по регулярке ^\s*[+-]?(\d*\.)?\d+([eE][+-]?\d+)?\s*$ к значению в десятеричной нотации. Строки по регулярке ^\s[+-]?*0[Xx][\dA-Fa-f]+\s*$ к значению в шестнадцатеричной нотации. Остальные строки — к NaN.
64. Из number в string (number).toString(n); Преобразовать в строку по базису n. (n по умолчанию 10) (32).toString(); // 32 (32).toString(10); // 32 (32).toString(16); // 20 (32).toString(2); // 100000 (32).toString(36); // w Math.random().toString(36);
65. Из number в string (number).toPrecision(n); Отображает только n значащих цифр в числе. Math.PI.toPrecision(3); // "3.14" (42).toPrecision(1); // "4e+1"
66. Из number в string (number).toFixed(n); Отображает с n цифр после запятой. 0.1 + 0.2; // "0.30000000000000004" (0.1 + 0.2).toFixed(2); // "0.30"
67. Из string в number parseInt(s, b); Разбирает строку как целое число по основанию b. Number("12 негритят"); // NaN parseInt("12 негритят"); // 12 parseInt(""); // NaN
68. Из string в number parseInt(s, b); В ECMA-262-3 если b не указано, оно определяется автоматически. parseInt("10"); // 10 parseInt("010"); // 8 parseInt("0x10"); // 16 parseInt("10", 10); // 10 parseInt("010", 10); // 10 parseInt("0x10", 10); // 0
69. Из string в number parseFloat(s); Разбирает строку как float. parseFloat("12 негритят"); // 12 parseFloat("9.5"); // 9.5 parseFloat("0x10"); // 0 parseFloat(""); // NaN parseFloat("Infinity"); // Infinity
70. < >
71. Из number в int32 Побитовые операторы требуют преобразования number (double) в int32. 12.5 | 0; // 12 ~~12.5; // 12 ~~NaN; // 0 ~~undefined; // 0
72. Из number в int32 Осторожнее с переполнением! ~~0x7FFFFFFF; // 2147483647 // 0111 1111 1111 1111 1111 1111 1111 1111 ~~0x80000000; // -2147483648 // 1000 0000 0000 0000 0000 0000 0000 0000 ~~(0x100000000 + 42); // 42 // 1 0000 0000 0000 0000 0000 0000 0010 1010
73. Из int32 в uint32 Оператор >>> очищает знаковый флаг ~~0xF0000000; // -268435456 -268435456 >>> 0; // 4026531840 (4026531840).toString(16); // f0000000
74. </ >
75. Логические операторы a && b a || b !a Оба операнда приводятся к boolean.
76. Арифметические операторы a * b a / b a % b a - b -a +a a++ a-- ++a --a Оба операнда приводятся к number
77. Сложение a + b Если хотя бы один из операндов string, оба приводятся к string и складываются как строки. Иначе — оба к number и складываются как числа.
78. Побитовые операторы a & b a ^ b a | b a >> b a << b a >>> b Оба операнда приводятся к int32
79. NaN Любое сравнение с NaN возвращает false. NaN никогда ничему не равен. Даже самому себе. NaN === NaN; // false NaN > NaN; // false NaN < NaN; // false
80. Операторы > и < Операнды приводятся к примитивам. Если оба операнда — строки, они сравниваются лексикографически. Иначе — приводятся к number. "99" > "100"; // true "99" > 100; // false
81. Оператор === Не приводит типы. Если операнды — ссылки на один и тот же объект, true. Если операнды примитивы и равны по значению, true. В остальных случаях false;
82. Оператор === var a = []; var b = []; a === b; // false var a = []; var b = a; a === b; // true 42 === "42"; // false
83. Оператор == Сравнение с приведением операндов. Поведение не всегда очевидно и предсказуемо.
84. == 1. Одинаковый тип? Если типы операндов одинаковые, == работает как ===: Если оба операнда — объекты, они сравниваются по ссылке, иначе — по значению.
85. == 1. Одинаковый тип? 2. null или undefined? Если хотя бы один из операндов null или undefined: null равен null. undefined равен undefined. null равен undefined. В остальных случаях false.
86. == 1. Одинаковый тип? 2. null или undefined? 3. Объект в примитив Если один из операндов объект, он приводится к примитиву.
87. == 1. Одинаковый тип? 2. null или undefined? 3. Объект в примитив 4. Оба операнда строки? Если оба операнда строки, сравнить их по значению.
88. == 1. Одинаковый тип? 2. null или undefined? 3. Объект в примитив 4. Оба операнда строки? 5. Привести к number Наконец, оба значения приводятся к number и сравниваются по значению.
89. == WTFJS: избранное var foo = []; foo == foo; // true foo == !foo; // true
90. Операторы >= и <= 1. Привести оба операнда к примитивам. 2. Сравнить a < b (или a > b). 3. Сравнить a == b. [] == []; // false [] <= []; // true ??? [] >= []; // true ???
91. Напоследок, ради приличия a += b; a !== b; a = a + b; !(a === b)
92. Javascript Объектно-ориентированный язык с утиной типизацией, прототипным наследованием и наследуемой областью видимости