beautify 1st part of the tutorial

This commit is contained in:
Ilya Kantor 2015-03-10 12:36:58 +03:00
parent e3dd2cedc0
commit 6444024a9d
327 changed files with 2358 additions and 1986 deletions

View file

@ -6,7 +6,9 @@
//+ run
var arr = ["a", "b"];
arr.push( function() { alert(this); } )
arr.push(function() {
alert( this );
})
arr[2](); // "a","b",function
```

View file

@ -7,8 +7,10 @@
```js
var arr = ["a", "b"];
arr.push( function() { alert(this); } )
arr.push(function() {
alert( this );
})
arr[2](); // ?
arr[2](); // ?
```

View file

@ -5,10 +5,12 @@
```js
//+ run
var obj = {
go: function() { alert(this) }
go: function() {
alert(this)
}
}
(obj.go)() // error!
(obj.go)() // error!
```
Причем сообщение об ошибке в большинстве браузеров не даёт понять, что на самом деле не так.
@ -18,6 +20,7 @@ var obj = {
JavaScript игнорирует перевод строки перед скобкой `(obj.go)()` и читает этот код как:
```js
//+ no-beautify
var obj = { go:... }(obj.go)()
```

View file

@ -5,6 +5,7 @@
Каков будет результат этого кода?
```js
//+ no-beautify
var obj = {
go: function() { alert(this) }
}

View file

@ -4,6 +4,7 @@
<li>Здесь не просто вызов `obj.method()`, а более сложный вызов вида `(выражение).method()`. Такой вызов работает, как если бы он был разбит на две строки:
```js
//+ no-beautify
f = obj.go; // сначала вычислить выражение
f(); // потом вызвать то, что получилось
```

View file

@ -5,7 +5,7 @@
Вызовы `(1)` и `(2)` в примере ниже работают не так, как `(3)` и `(4)`:
```js
//+ run
//+ run no-beautify
"use strict"
var obj, f;

View file

@ -6,13 +6,13 @@ var name = "";
var user = {
name: "Василий",
*!*
export: this // (*)
*/!*
};
};
alert(user.export.name);
alert( user.export.name );
```
Объявление объекта само по себе не влияет на `this`. Никаких функций, которые могли бы повлиять на контекст, здесь нет.

View file

@ -9,10 +9,10 @@ var name = "";
var user = {
name: "Василий",
export: this
};
alert(user.export.name);
export: this
};
alert( user.export.name );
```

View file

@ -9,13 +9,13 @@ var name = "";
var user = {
name: "Василий",
export: function() {
export: function() {
return this;
}
};
};
alert(user.export().name);
alert( user.export().name );
```

View file

@ -9,15 +9,15 @@ var name = "";
var user = {
name: "Василий",
export: function() {
return {
return {
value: this
};
}
};
};
alert(user.export().value.name);
alert( user.export().value.name );
```

View file

@ -10,8 +10,8 @@
</ul>
```js
var calculator = {
... ваш код...
var calculator = {
...ваш код...
}
calculator.read();

View file

@ -4,20 +4,20 @@
//+ run
var ladder = {
step: 0,
up: function() {
this.step++;
up: function() {
this.step++;
return this;
},
down: function() {
this.step--;
down: function() {
this.step--;
return this;
},
showStep: function() {
alert(this.step);
showStep: function() {
alert( this.step );
return this;
}
}
ladder.up().up().down().up().down().showStep(); // 1
ladder.up().up().down().up().down().showStep(); // 1
```

View file

@ -7,14 +7,14 @@
```js
var ladder = {
step: 0,
up: function() { // вверх по лестнице
up: function() { // вверх по лестнице
this.step++;
},
down: function() { // вниз по лестнице
down: function() { // вниз по лестнице
this.step--;
},
showStep: function() { // вывести текущую ступеньку
alert(this.step);
alert( this.step );
}
};
```
@ -31,7 +31,7 @@ ladder.showStep(); // 1
Модифицируйте код методов объекта, чтобы вызовы можно было делать цепочкой, вот так:
```js
ladder.up().up().down().up().down().showStep(); // 1
ladder.up().up().down().up().down().showStep(); // 1
```
Такой подход называется "чейнинг" (chaining) и используется, например, во фреймворке jQuery.

View file

@ -16,7 +16,7 @@ var user = {
// метод
*/!*
sayHi: function() {
alert('Привет!');
alert( 'Привет!' );
}
};
@ -101,7 +101,7 @@ admin.sayHi(); // упс! внутри sayHi обращение по старо
Через `this` метод может не только обратиться к любому свойству объекта, но и передать куда-то ссылку на сам объект целиком:
```js
//+ run
//+ run no-beautify
var user = {
name: 'Василий',
@ -138,7 +138,7 @@ function sayHi() {
**Если одну и ту же функцию запускать в контексте разных объектов, она будет получать разный `this`:**
```js
//+ run
//+ run no-beautify
var user = { firstName: "Вася" };
var admin = { firstName: "Админ" };
@ -169,8 +169,8 @@ admin['g'](); // Админ (не важно, доступ к объекту ч
```js
//+ run
function func() {
alert(this); // выведет [object Window] или [object global]
function func() {
alert( this ); // выведет [object Window] или [object global]
}
func();
@ -182,9 +182,9 @@ func();
```js
//+ run
function func() {
function func() {
"use strict";
alert(this); // выведет undefined (кроме IE9-)
alert( this ); // выведет undefined (кроме IE9-)
}
func();
@ -199,7 +199,7 @@ func();
Любой более хитрый вызов приведёт к потере контекста, например:
```js
//+ run
//+ run no-beautify
var user = {
name: "Вася",
hi: function() { alert(this.name); },