Блог веб разработки

Блог веб-разработки статьи | видеообзоры | исходный код

расширения js

Всем привет сегодня мы с вами рассмотрим оператор расширения на примере разделения массива на аргументы функции. Мы будем рассматривать оператор расширения в основном на примерах работы с массивами.

До появления ES6, чтобы передать значения из массива в аргументы функции, программисты применяли метод apply().Пример:

function myFunction(a,b){
return a+b;
}
var data = [1,4];
var result = myFunction.apply(null,data);
console.log(result);

Результатом данного кода будет:

5

ES6 обеспечивает более простой способ основанный на использовании оператора расширения:

function myFunction(a,b){
return a+b;
}
var data = [1,4];
var result = myFunction(...data);
console.log(result);

Как видите результат точно такой же, но здесь мы использовали оператор расширения '...'.

Во время выполнения перед вызовом функции myFunction, интерпретатор javascript заменит ...data выражением 1,4

Другие применения оператора расширений:

Определение значения массива как части другого массива

var array1 = [2,3,4];
var array2 = [1,...array1,5,6,7,8,9];
console.log(array2);//Выведет массив со значениями "1,2,3,4,5,6,7,8,9"

Копирование значений из одного массива в другой

var array1 = [4];
var array2 = [1,2,3];
array2.push(...array1);
console.log(array2);//Выведет массив следующего содержания "1,2,3,4"

Использование оператора расширения для работы с параметрами функции, рассмотрим следующий код

function myFunction(a,b){
var arg = Array.prototype.slice.call(arguments, myFunction.length);
console.log(arg);
}
myFunction(1,2,3,4,5);//Выведет 3,4,5

Теперь сделаем тоже самое, но через оператор расширения

function myFunction(a,b,...arg){
console.log(arg);
}
myFunction(1,2,3,4,5);//Выведет 3,4,5

Как можно заметить код значительно сократился и стал проще, с чем это связано? А тем что объект arguments изначально не является массивом , поэтому его для начала необходимо преобразовать. Дополнительный параметр как раз наоборот изначально является массивом.

Вот такой замечательный оператор появился в ES6, пользуйтесь.

Надеюсь данная статья была интересна и понятна. Желаю успехов в освоении программирования! Удачи!

Оцените статью

Еще статьи

window location JavaScript

капча php

gitignore GIT

Ветки GIT

CSS перенос слов

JavaScript cookie

CSS supports

out of range

Python сервер

Комментарии

Проверочный код

В данном разделе пока нет комментариев!

История

    ПОДПИСКА

    • Подпишись и получай информацию о выходе новых статей на почту! Просто введите свою почту, нажмите кнопку подписаться. На почту должно будет прийти сообщение с потверждением подписки. Если сообщение не пришло проверьте раздел спам или попробуйте другую почту. Также по всем техническим проблемам вы можете написать в поддержку

    НОВОСТИ

    • Всем привет! Запустил новый сервис для поиска и бесплатного скачивания, прослушивания аудиокниг. Здесь вы можете найти множество литературы и прослушать ее. Вскоре возобновлю написание статей.