В новой версии JavaScript есть только 2 новые функции. Вот как они работают.
Речь пойдет о последней версии JavaScript: ECMAScript 2016 (более известный как ES7). ES7 предлагает две новые функции:
Прошли те времена, когда мы использовали
Ключевое слово «существует».
Но если наша цель — знать, существует ли данный элемент в массиве, то
Ощущается прирост сил, когда мы погружаемся в спецификацию.
В спецификации указано:
Пойдем шаг за шагом и попытаемся понять спецификацию с помощью примеров.
Вы начинаете ощущать силу?
Мы даже не трогали
Давайте посмотрим спецификацию:
ОК, еще одна новая функция.
Мы ждали того дня, когда мы сможем играть с экспоненциальными числами, как мы играем с добавлением, вычитанием, умножением, делением.
Этот день настал.
Оператор
Вот оно.
Теперь у вас есть сила ES7. Используйте её хорошо.
Спасибо:
Перевод выполнен при поддержке компании EDISON Software, которая профессионально занимается разработкой сайтов-каталогов на ASP.NET для крупных заказчиков и создает полезное приложение против прокрастинации.
Речь пойдет о последней версии JavaScript: ECMAScript 2016 (более известный как ES7). ES7 предлагает две новые функции:
Array.prototype.includes()
и новый экспоненциальный оператор: **
Array.prototype.includes()
Прошли те времена, когда мы использовали
.indexOf ()
, чтобы узнать, существует ли элемент в массиве. ['my','mom','hates','me'].indexOf('mom') // 1
// I know it sounds confusing but the value 1 represents
// the index at which the string 'mom' appears in the array.
// Not that I only have 1 mom.
Ключевое слово «существует».
.indexOf ()
хорош, если мы хотим знать, у какого индекса является данный элемент.Но если наша цель — знать, существует ли данный элемент в массиве, то
.indexOf ()
не самый лучший вариант. И причина проста: при запросе существования чего-либо мы ожидаем логическое значение, а не число. Array.prototype.includes ()
делает именно это. Он определяет, существует ли данный элемент в массиве, возвращая true
, если это так, а иначе false
.var life = ['mom', 'dad', 'brother']
life.includes('mom') // true
life.includes('girlfriend') // false
Пройдемся по спецификации
Array.prototype.includes ( searchElement [ , fromIndex ] )
searchElement
— элемент для поиска.fromIndex
(необязательно) — индекс, с которого следует начинать поиск.
Ощущается прирост сил, когда мы погружаемся в спецификацию.
В спецификации указано:
Пойдем шаг за шагом и попытаемся понять спецификацию с помощью примеров.
# includes
# [1] searchs in ascending order
> Array(10000000).concat(4).includes(4)
true # [Time] 500 miliseconds
> [4].concat(Array(10000000)).includes(4)
true # [Time] 90 miliseconds
# [2] uses SameValueZero algorithm
> [NaN].indexOf(NaN)
-1
> [NaN].includes(NaN)
true
# [3] if found at any position returns true
# otherwise, false is returned
> [1, 2, 3].includes(2)
true
> [1, 2, 3].includes(7)
false
# [4] it treats missing array elements as undefined
> [1, , 3].indexOf(undefined)
-1
> [1, , 3].includes(undefined)
true
- Разница здесь в позиции элемента 4. Поскольку наш первый пример помещает 4 в последнюю позицию, то поиск идет по всему массиву. Спецификации
.includes ()
возвращает значение сразу после нахожденияsearchElement
. Это делает нашу вторую операцию намного быстрее. - Большая разница алгоритмов SameValueZero и Strict Equality Comparison (используется
.indexOf ()
) заключается в том, что он позволяет обнаруживать элементы NaN. - Он возвращает логическое значение
true
, когда элемент найден иfalse
в противном случае. Больше нет индексов в результате. - В отличие от
.indexOf ()
,.includes ()
не пропускает отсутствующие элементы массива. Вместо этого он рассматривает их как Undefined.
Вы начинаете ощущать силу?
Мы даже не трогали
fromIndex
.Давайте посмотрим спецификацию:
Необязательный второй аргументfromIndex
по умолчанию равен0
(т. е. Выполняется поиск всего массива). Если он больше или равен длине массива, возвращается false, т. е. поиска по массиву не будет. Если он отрицательный, он используется как смещение от конца массива для вычисленияfromIndex
. Если вычисленный индекс меньше0
, то будет поиск по всему массиву.
# fromIndex
# [1] it defaults to 0
> [1,2,3].includes(1)
true
# [2] if >= array.length, false is returned
> [1,2,3].includes(1, 10)
false
# [3] if negative, it is used as the offset, i.e.
# offset = array.length + fromIndex
> [1,2,3].includes(3, -2) # fromIndex = 3 (array length) + -2 (fromIndex) = 1
true
# [4] if offset < 0, the whole array is searched
> [1,2,3].includes(1, -5) # fromIndex = 0
true
- Если
fromIndex
не задан, то устанавливается значение по умолчанию —0
и выполняется поиск по всему массиву. .includes ()
немедленно возвращает false, когда значениеfromIndex
больше длины массива.- Если
fromIndex
отрицательный, то его значение вычисляется какarray.length - fromIndex
. Это особенно полезно при поиске по последним элементам. Например,fromIndex = -5
совпадает с поиском по последним 5 элементам. - Чтобы избавить
.includes ()
от ошибки, когда вычисленное значениеfromIndex
получается меньше 0, выполняется поиск всего массива. Я бы предпочел ошибку.
ОК, еще одна новая функция.
Экспоненциальный оператор (**)
Мы ждали того дня, когда мы сможем играть с экспоненциальными числами, как мы играем с добавлением, вычитанием, умножением, делением.
Этот день настал.
Оператор
**
ведет себя точно так же, как Math.pow ()
. Он возвращает результат повышения первого операнда до степени второго (например, x ** y
).# x ** y (aka Math.pow(x,y))
> 2 ** 2
4
> 2 ** 'operand'
NaN
Вот оно.
Теперь у вас есть сила ES7. Используйте её хорошо.
Спасибо:
- 2ality.com от Axel Rauschmayer
- Спецификации языка ECMAScript 2016
- Всем поклонникам He-Man
- freeCodeCamp за публикацию
Перевод выполнен при поддержке компании EDISON Software, которая профессионально занимается разработкой сайтов-каталогов на ASP.NET для крупных заказчиков и создает полезное приложение против прокрастинации.