ES6 스프레드 연산자

ES6의 스프레드 연산자는 매개변수를 다중 매개변수 함수에 전달하고, Apply를 대체하고, 배열을 병합하고, 값을 소멸 및 할당하는 데 큰 편의성을 제공하므로 매우 유용하다고 할 수 있습니다.

확산 연산자는 세 개의 점 "..."입니다. 이는 Iterator 인터페이스를 구현하는 객체의 각 요소가 하나씩 반복되고 개별적으로 사용된다는 의미입니다.

이 예를 보세요:

console.log(...[3, 4, 5])

결과:

3 4 5

실제 호출은 다음과 같습니다.

console.log(3, 4, 5)

배열 병합

사용할 수 있습니다. 스프레드 연산자는 여러 개를 결합합니다. 배열.

let arr1 = [1, 2, 3]
let arr2 = [4, 5, 6]
let arr3 = [7, 8, 9]
console.log([...arr1, ...arr2, ...arr3])

결과:

[ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

함수 다중 매개변수 전송, 바꾸기 Apply

먼저 매개변수를 배열로 정의하면 함수가 정의됩니다.

let arr4 = ['arg1', 'arg2', 'arg3', 'arg4']
let fun1 = (a1, a2, a3, a4) => {
  console.log( a1, a2, a3, a4)
}

ES6 이전에는 함수를 호출하려면 배열 매개변수를 함수에 전달하거나 첨자에 따라 배열 요소에 액세스해야 했습니다. 단점은 배열의 개수와 함수 매개변수의 개수가 완전히 다르다는 것입니다. 바운드되어 하나의 숫자가 변경되면 수정해야 합니다.

fun1(arr4[0], arr4[1], arr4[2], arr4[3])

아니면 그냥 Apply를 사용해 호출해도 결과는 당연히 문제가 없고, ES6 이전에도 가장 많이 사용되던 방식이었습니다.

fun1.apply(null, arr4)

스프레드 연산자를 이용하시면 편리합니다.

fun1(...arr4)

결과:

arg1 arg2 arg3 arg4

통화는 간단하고 상쾌합니다.

구조 분해 및 할당

과 함께 사용하면 배열의 첫 번째 요소 이후의 모든 요소를 ​​다른 배열로 추출할 수 있습니다.

let [var1, ...arr5] = [1, 2, 3, 4, 5, 6]
console.log(var1)
console.log(arr5)

결과:

1[ 2, 3, 4, 5, 6 ]

그러나 구조 분해와 결합할 때 스프레드 연산자는 마지막 연산자에만 사용할 수 있으며 그렇지 않으면 오류가 보고됩니다.

Iterator 인터페이스를 구현하는 객체를 확장할 수 있습니다

예를 들어 Map, Set 및 배열은 Iterator 인터페이스에서 구현되지만 Object는 그렇지 않으므로 Object를 확장하면 오류가 보고됩니다.

확장 세트.

let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
console.log(...set1)

결과:

1 2 3

확장 지도.

let map1 = new Map();
map1.set('k1', 1);
map1.set('k2', 2);
map1.set('k3', 3);
console.log(...map1)

결과:

[ 'k1', 1 ] [ 'k2', 2 ] [ 'k3', 3 ]

맵의 키-값 쌍 구조에 따라 각 배열에는 2개의 요소가 있습니다. 하나는 키이고 다른 하나는 값입니다.

Object를 확장하면 오류가 보고됩니다.

rreee

위 내용은 ES6 스프레드 연산자의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!