Подтвердить что ты не робот

Синтаксис распространения и параметр останова в ES2015/ES6

Я смущен синтаксисом и параметром rest в ES2015. Может ли кто-нибудь объяснить разницу между ними с надлежащими примерами?

4b9b3361

Ответ 1

При использовании спреда вы расширяете одну переменную до более:

var abc = ['a', 'b', 'c'];
var def = ['d', 'e', 'f'];
var alpha = [ ...abc, ...def ];
console.log(alpha)// alpha == ['a', 'b', 'c', 'd', 'e', 'f'];

Ответ 2

ES6 имеет новую функцию: три точки ...

Вот как мы можем использовать эти точки:

Как Rest/Collector/Gather

var [c, ...m] = [1,2,3,4,5]; // m -> [2,3,4,5]

Здесь ...m - коллекционер, он собирает остальные параметры. Внутренне, когда мы пишем:

var [c, ...m] = [1,2,3,4,5]; JavaScript делает следующее

var c = 1,
    m = [2, 3, 4, 5];

Как спред

var params = [ "hello", true, 7 ];
var other = [ 1, 2, ...params ]; // other => [1,2,"hello", true, 7]

Здесь ...params распространяется таким образом, чтобы все его элементы были привязаны к other

Внутренне javaScript делает следующее

var other = [1, 2].concat(params);

Надеюсь, что это поможет.

Ответ 3

Краткое описание:

В javascript ... перегружен. Он выполняет различные операции в зависимости от того, где используется оператор:

  1. При использовании в аргументах функции объявления/выражения функции declaration/expression он преобразует оставшиеся аргументы в массив. Этот вариант называется синтаксисом Rest параметров.
  2. В других случаях он распространит значения итерируемого в местах, где ожидаются ноль или более аргументов (вызовы функций) или элементы (литералы массива). Этот вариант называется Spread.

Пример:

Синтаксис параметра Rest:

function rest(first, second, ...remainder) {
  console.log(remainder);
}

// 3, 4 ,5 are the remaining parameters and will be 
// merged together in to an array called remainder 
rest(1, 2, 3, 4, 5);

Ответ 4

  Когда мы видим "..." в коде, это либо остальные параметры, либо оператор распространения.

Есть простой способ различить их:

Когда... находится в конце параметров функции, ее "остальные параметры" и собирает остальную часть списка в массив. Когда... происходит в вызов функции или тому подобное, он называется "оператором распространения" и расширяет массив в список. Используйте шаблоны:

Остальные параметры используются для создания функций, которые принимают любое количество аргументы. Оператор распространения используется для передачи массива в функции это обычно требует списка многих аргументов. Вместе они помогают перемещаться между списком и массивом параметров с легкостью. Для получения дополнительной информации об этом нажмите здесь

Ответ 5

В принципе, как в Python:

>>> def func(first, *others):
...    return [first, *others]
>>> func('a', 'b', 'c')
['a', 'b', 'c']

Ответ 6

В ES6 эти три точки ... имеют два значения: оператор Spread и параметр Rest

Оператор распространения: вы используете три точки для расширения iterables, iterables, iterables я имею в виду arrays, string и т.д. В качестве аргументов. Например, функция Math.max() ожидает неопределенное количество аргументов, чтобы вы могли использовать оператор Spread для расширения элементов в качестве аргументов функции Math.max(). Вот пример из mdn

console.log(Math.max(1, 3, 2));
// expected output: 3

console.log(Math.max(-1, -3, -2));
// expected output: -1

var array1 = [1, 3, 2];

console.log(Math.max(...array1));
// expected output: 3

Другой вариант использования - добавить, например, этот массив

const videoGames = ['mario galaxy', 'zelda wind waker', 'ico'];

Вы можете добавить его в другой массив

const favoritesVideoGames = ['Shadow of the colosus', ...videoGames];

Тогда favoritesVideoGames значение

[ 'Shadow of the colosus', 'mario galaxy', 'zelda wind waker', 'ico' ]

О параметре Rest, здесь определение MDN

Синтаксис остальных параметров позволяет нам представить неопределенное количество аргументов в качестве массива.

Это означает, что вы можете упаковать множество элементов в один элемент

Вот пример из MDN

function sum(...theArgs) {
  return theArgs.reduce((previous, current) => {
    return previous + current;
  });
}

console.log(sum(1, 2, 3));
// expected output: 6

console.log(sum(1, 2, 3, 4));
// expected output: 10

Я обычно путаюсь с этими тремя моментами, эта иллюстрация от @stephaniecodes помогает мне запомнить ее логику. Я упоминаю, что я взял вдохновение из этой иллюстрации, чтобы ответить на этот вопрос.

Надеюсь, это полезно.

Ответ 7

Оператор Javascript с тремя точками (...) можно использовать двумя различными способами:

  1. Параметр rest: собирает все оставшиеся элементы в массив.

var days = ["Sat", "Sun", "Mon", "Tue", "Wed", "Thu", "Fri"];
const [sat, sun, ...weekdays] = days;
console.log(sat); // "Sat"
console.log(sun); // "Sun"
console.log(weekdays); // ["Mon", "Tue", "Wed", "Thu", "Fri"]

Ответ 8

В связи с этим я не могу понять, как мы передаем функцию и возвращаем аргументы в javascript

Функция - это набор инструкций, который принимает некоторые входные данные, обрабатывает их и возвращает результат.

здесь у нас есть массив [1, 2, 3, 4, 5, 6], и функция фильтра перебирает каждый элемент и передает каждый элемент положительным функциям, которые возвращают число, если оно четное, иначе пропускает его.

след:

1 => Filter(1) => positive(1) => skips 1,
2 => Filter(2) => positive(2) => returns 2,
3 => Filter(3) => positive(3) => skips 3,
...
6 => Filter(6) => positive(6) => returns 6

отсюда и результат [2, 4, 6]