fixes #32 and other
This commit is contained in:
parent
99372573cb
commit
bc8be798f7
4 changed files with 33 additions and 10 deletions
|
@ -89,7 +89,7 @@ alert( +false ); // 0
|
|||
alert( "\n0 " == 0 ); // true
|
||||
```
|
||||
|
||||
При этом строка `"\n"` преобразуется к числу, как указано выше: начальные и конечные пробелы обрезаются, получается пустая строка `""`, которая равна `0`.</li>
|
||||
При этом строка `"\n0"` преобразуется к числу, как указано выше: начальные и конечные пробелы обрезаются, получается строка `"0"`, которая равна `0`.</li>
|
||||
</li>
|
||||
<li>С логическими значениями:
|
||||
|
||||
|
|
|
@ -3,6 +3,7 @@
|
|||
Обычный синтаксис `{...}` позволяет создать один объект. Но зачастую нужно создать много однотипных объектов.
|
||||
|
||||
Для этого используют "функции-конструкторы", запуская их при помощи специального оператора `new`.
|
||||
|
||||
[cut]
|
||||
## Конструктор
|
||||
|
||||
|
@ -21,12 +22,14 @@ var animal = new Animal("ёжик");
|
|||
*/!*
|
||||
```
|
||||
|
||||
Технически, любую функцию можно вызвать при помощи `new`. Но при этом она работает несколько иным образом, чем обычно, поэтому функции, предназначенные к вызову через `new`, называют с большой буквы.
|
||||
Заметим, что, технически, любая функция может быть использована как конструктор. То есть, любую функцию можно вызвать при помощи `new`. Как-то особым образом указывать, что она -- конструктор -- не надо.
|
||||
|
||||
**Алгоритм работы функции, запущенной через `new`:**
|
||||
Но, чтобы выделить функции, задуманные как конструкторы, их называют с большой буквы: `Animal`, а не `animal`.
|
||||
|
||||
Детальнее -- функция, запущенная через `new`, делает следующее:
|
||||
|
||||
<ol>
|
||||
<li>Автоматически создается новый пустой объект.</li>
|
||||
<li>Создаётся новый пустой объект.</li>
|
||||
<li>Ключевое слово `this` получает ссылку на этот объект.</li>
|
||||
<li>Функция выполняется. Как правило, она модифицирует `this`, добавляет методы, свойства.</li>
|
||||
<li>Возвращается `this`.</li>
|
||||
|
@ -47,7 +50,7 @@ animal = {
|
|||
```js
|
||||
function Animal(name) {
|
||||
*!*
|
||||
// this = {}
|
||||
// this = {};
|
||||
*/!*
|
||||
|
||||
// в this пишем свойства, методы
|
||||
|
@ -55,11 +58,31 @@ function Animal(name) {
|
|||
this.canWalk = true;
|
||||
|
||||
*!*
|
||||
// return this
|
||||
// return this;
|
||||
*/!*
|
||||
}
|
||||
```
|
||||
|
||||
Теперь многократными вызовами `new Animal` с разными параметрами мы можем создать столько объектов, сколько нужно. Поэтому такую функцию и называют *конструктором* -- она предназначена для "конструирования" объектов.
|
||||
|
||||
[smart header="new function() { ... }"]
|
||||
Иногда функцию-конструктор объявляют и тут же используют, вот так:
|
||||
```js
|
||||
var animal = new function() {
|
||||
this.name = "Васька";
|
||||
this.canWalk = true;
|
||||
};
|
||||
```
|
||||
Так делают, когда хотят создать единственный объект данного типа. Примере выше с тем же успехом можно было бы переписать как:
|
||||
```js
|
||||
var animal = {
|
||||
name: "Васька",
|
||||
canWalk: true
|
||||
}
|
||||
```
|
||||
...Но обычный синтаксис `{...}` не подходит, когда при создании свойств объекта нужны более сложные вычисления. Их можно проделать в функции-конструкторе и записать результат в `this`.
|
||||
[/smart]
|
||||
|
||||
## Правила обработки return
|
||||
|
||||
Как правило, конструкторы ничего не возвращают. Их задача -- записать всё, что нужно, в `this`, который автоматически станет результатом.
|
||||
|
@ -176,6 +199,8 @@ vasya.sayHi(); // Привет, Вася Петров
|
|||
|
||||
Те функции и данные, которые должны быть доступны для внешнего кода, мы пишем в `this` -- и к ним можно будет обращаться, как например `vasya.sayHi()`, а вспомогательные, которые нужны только внутри самого объекта, сохраняем в локальной области видимости.
|
||||
|
||||
[]
|
||||
|
||||
## Итого
|
||||
|
||||
Объекты могут быть созданы при помощи функций-конструкторов:
|
||||
|
|
|
@ -213,9 +213,7 @@ parentElem.appendChild(elem)
|
|||
|
||||
Конечно, можно сделать функцию для генерации сообщений и поместить туда этот код, но в ряде случаев гораздо эффективнее -- *клонировать* существующий `div`, а потом изменить текст внутри. В частности, если элемент большой, то клонировать его будет гораздо быстрее, чем пересоздавать.
|
||||
|
||||
Вызов `elem.cloneNode(true)` создаст "глубокую" копию элемента -- вместе с атрибутами, включая подэлементы. Если же вызвать с аргумнтом `false`, то он копия будет без подэлементов, но это нужно гораздо реже.
|
||||
|
||||
### Копия сообщения
|
||||
Вызов `elem.cloneNode(true)` создаст "глубокую" копию элемента -- вместе с атрибутами, включая подэлементы. Если же вызвать с аргументом `false`, то копия будет сделана без дочерних элементов. Это нужно гораздо реже.
|
||||
|
||||
Пример со вставкой копии сообщения:
|
||||
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
var selectedTd;
|
||||
|
||||
*!*
|
||||
table.onclick = function(event) {
|
||||
table.onclick = function(event) {
|
||||
var target = event.target; // где был клик?
|
||||
|
||||
if (target.tagName != 'TD') return; // не на TD? тогда не интересует
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue