es6
|
@ -1,5 +1,10 @@
|
||||||
# ES-2015 сейчас
|
# ES-2015 сейчас
|
||||||
|
|
||||||
|
[smart header="Этот раздел -- в активной разработке"]
|
||||||
|
Стандарт ES-2015 недавно был принят окончательно, и этот раздел находится в ежедневной разработке.
|
||||||
|
|
||||||
|
[/smart]
|
||||||
|
|
||||||
[Стандарт ES-2015](http://www.ecma-international.org/publications/standards/Ecma-262.htm) был принят в июне 2015. Пока что большинство браузеров реализуют его частично, текущее состояние реализации различных возможностей можно посмотреть здесь: [](https://kangax.github.io/compat-table/es6/), поэтому в этом учебнике ему выделена отдельная секция.
|
[Стандарт ES-2015](http://www.ecma-international.org/publications/standards/Ecma-262.htm) был принят в июне 2015. Пока что большинство браузеров реализуют его частично, текущее состояние реализации различных возможностей можно посмотреть здесь: [](https://kangax.github.io/compat-table/es6/), поэтому в этом учебнике ему выделена отдельная секция.
|
||||||
|
|
||||||
Когда стандарт будет поддерживаться почти целиком везде, то весь учебник будет обновлён в соответствии с ним.
|
Когда стандарт будет поддерживаться почти целиком везде, то весь учебник будет обновлён в соответствии с ним.
|
||||||
|
|
22
1-js/10-es-modern/3-string-changes/article.md
Normal file
|
@ -0,0 +1,22 @@
|
||||||
|
|
||||||
|
# Строки [в работе]
|
||||||
|
|
||||||
|
В строках улучшена поддержка юникода и добавлены новые методы.
|
||||||
|
|
||||||
|
## Поддержка юникода
|
||||||
|
|
||||||
|
Это улучшение имеет значение только если мы поддерживаем китайский и другие языки, которые выходят за границы стандартного 2-байтового диапазона.
|
||||||
|
|
||||||
|
Дело в том, что долгое время JavaScript имел внутреннюю кодировку UTF-16, то есть под каждый символ отводилось ровно два байта.
|
||||||
|
|
||||||
|
Под всевозможные символы всех языков мира двух байт не хватает.
|
||||||
|
|
||||||
|
Поэтому, к примеру, китайские иероглифы представляются двумя юникодными, например:
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
alert( "我".length ); // 2
|
||||||
|
```
|
||||||
|
|
||||||
|
Такое представление, когда одному символу языка соответствует два юникодных символа, называют "суррогатные пары".
|
||||||
|
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 30 KiB |
|
@ -664,9 +664,117 @@ httpGet('/article/promise/userNoGithub.json')
|
||||||
В консоли тоже ничего не будет, так как ошибка остаётся "внутри" промиса, ожидая добавления следующего обработчика `onRejected`, которому будет передана.
|
В консоли тоже ничего не будет, так как ошибка остаётся "внутри" промиса, ожидая добавления следующего обработчика `onRejected`, которому будет передана.
|
||||||
|
|
||||||
|
|
||||||
|
## Вспомогательные методы
|
||||||
|
|
||||||
|
В классе `Promise` есть следующие статические методы.
|
||||||
|
|
||||||
|
### Promise.all(iterable)
|
||||||
|
|
||||||
|
Вызов `Promise.all(iterable)` получает массив (или другой итерируемый объект) промисов и возвращает промис, который завершается, когда все они завершаться, с их результатом.
|
||||||
|
|
||||||
|
Например:
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
|
||||||
|
Promise.all([
|
||||||
|
httpGet('/article/promise/user.json'),
|
||||||
|
httpGet('/article/promise/guest.json')
|
||||||
|
]).then(results => {
|
||||||
|
results = results.map(JSON.parse);
|
||||||
|
alert( results[0].name + ', ' + results[1].name ); // iliakan, guest
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
Заметим, что если какой-то из промисов завершился с ошибкой, то результатом `Promise.all` будет эта ошибка. При этом остальные промисы игнорируются.
|
||||||
|
|
||||||
|
Например:
|
||||||
|
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
|
||||||
|
Promise.all([
|
||||||
|
httpGet('/article/promise/user.json'),
|
||||||
|
httpGet('/article/promise/guest.json'),
|
||||||
|
httpGet('/article/promise/no-such-page.json') // (нет такой страницы)
|
||||||
|
]).then(
|
||||||
|
result => alert("не сработает"),
|
||||||
|
error => alert("Ошибка: " + error.message) // Ошибка: Not Found
|
||||||
|
)
|
||||||
|
```
|
||||||
|
|
||||||
|
### Promise.race(iterable)
|
||||||
|
|
||||||
|
Как и `Promise.all` получает итерируемый объект с промисами и возвращает новый промис.
|
||||||
|
|
||||||
|
Но, в отличие от `Promise.all`, результатом будет только первый успешно выполнившийся промис из списка. Остальные игнорируются.
|
||||||
|
|
||||||
|
Например:
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
|
||||||
|
Promise.race([
|
||||||
|
httpGet('/article/promise/user.json'),
|
||||||
|
httpGet('/article/promise/guest.json')
|
||||||
|
]).then(firstResult => {
|
||||||
|
firstResult = JSON.parse(firstResult);
|
||||||
|
alert( firstResult.name ); // iliakan или guest, смотря что загрузится раньше
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### Promise.resolve(value)
|
||||||
|
|
||||||
|
Вызов `Promise.resolve(value)` создаёт успешно выполнившийся промис с результатом `value`.
|
||||||
|
|
||||||
|
Он аналогичен конструкции:
|
||||||
|
|
||||||
|
```js
|
||||||
|
new Promise((resolve) => resolve(value))
|
||||||
|
```
|
||||||
|
|
||||||
|
`Promise.resolve`, когда хотят построить асинхронную цепочку, и начальный результат уже есть.
|
||||||
|
|
||||||
|
|
||||||
|
Например:
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
Promise.resolve(window.location) // начать с этого значения
|
||||||
|
.then(httpGet) // вызвать для него httpGet
|
||||||
|
.then(alert) // и вывести результат
|
||||||
|
```
|
||||||
|
|
||||||
|
### Promise.reject(error)
|
||||||
|
|
||||||
|
Аналогично `Promise.resolve(value)` создаёт уже выполнившийся промис, но не с успешным результатом, а с ошибкой `error`.
|
||||||
|
|
||||||
|
Например:
|
||||||
|
|
||||||
|
```js
|
||||||
|
//+ run
|
||||||
|
Promise.reject(new Error("..."))
|
||||||
|
.catch(alert) // Error: ...
|
||||||
|
```
|
||||||
|
|
||||||
|
Метод `Promise.reject` используется очень редко, гораздо реже чем `resolve`, потому что ошибка возникает обычно не в начале цепочки, а в процессе её выполнения.
|
||||||
|
|
||||||
|
### Итого
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Промис -- это специальный объект, который хранит своё состояние, текущий результат (если есть) и коллбэки.</li>
|
||||||
|
<li>При создании `new Promise((resolve, reject) => ...)` автоматически запускается функция-аргумент, которая должна вызвать `resolve(result)` при успешном выполнении и `reject(error)` -- при ошибке.</li>
|
||||||
|
<li>Аргумент `resolve/reject` (только первый, остальные игнорируются) передаётся обработчикам на этом промисе.</li>
|
||||||
|
<li>Обработчики назначаются вызовом `.then/catch`.</li>
|
||||||
|
<li>Для передачи результата от одного обработчика к другому используется чейнинг.</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
В современной JavaScript-разработки промисы в явном виде используются, как ни странно, довольно редко.
|
||||||
|
|
||||||
|
Тем не менее, понимать промисы нужно обязательно, так как бывают ситуации, когда без них сложно.
|
||||||
|
|
||||||
|
Промисы служат основой для более продвинутых способов написания асинхронного кода, использующих генераторы. Мы рассмотрим их далее в этом разделе.
|
||||||
|
|
||||||
|
|
||||||
[head]
|
[head]
|
4
1-js/10-es-modern/4-promise/guest.json
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"name": "guest",
|
||||||
|
"isAdmin": false
|
||||||
|
}
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 38 KiB After Width: | Height: | Size: 38 KiB |
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 46 KiB |
Before Width: | Height: | Size: 99 KiB After Width: | Height: | Size: 99 KiB |
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 51 KiB After Width: | Height: | Size: 51 KiB |
Before Width: | Height: | Size: 40 KiB After Width: | Height: | Size: 40 KiB |
Before Width: | Height: | Size: 88 KiB After Width: | Height: | Size: 88 KiB |
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
Before Width: | Height: | Size: 110 KiB After Width: | Height: | Size: 110 KiB |
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 50 KiB |
Before Width: | Height: | Size: 113 KiB After Width: | Height: | Size: 113 KiB |
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 36 KiB |
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 61 KiB |
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 34 KiB |
Before Width: | Height: | Size: 76 KiB After Width: | Height: | Size: 76 KiB |