>웹 프론트엔드 >JS 튜토리얼 >확장 구문의 이점과 ES6의 나머지 구문과 어떻게 다른지 설명하세요.

확장 구문의 이점과 ES6의 나머지 구문과 어떻게 다른지 설명하세요.

WBOY
WBOY앞으로
2023-09-19 21:21:03865검색

解释一下扩展语法的好处以及它与 ES6 中的剩余语法有何不同?

JavaScript ES6 버전에서는 매우 강력한 기능으로 확장 구문이 도입되었습니다. 확장 구문을 사용하여 배열이나 객체를 동일한 데이터 유형의 변수로 확장할 수 있습니다.

예를 들어 ES6에 스프레드 구문이 도입되기 전에 개발자는 for 루프를 사용하여 한 배열의 모든 요소를 ​​다른 배열로 복사했습니다. for 루프를 사용하여 5~7줄의 코드를 작성하는 대신 확장 구문을 사용하여 선형 코드를 작성하여 한 배열의 모든 요소를 ​​다른 배열로 복사할 수 있습니까? 응, 제대로 들었어!

이 튜토리얼에서는 확장 구문의 다양한 사용 사례를 배웁니다. 또한 튜토리얼 마지막 부분에서 나머지 구문과 어떻게 다른지 살펴보겠습니다.

전파 문법

JavaScript의 확장 구문은 반복 가능한 개체(예: 배열 또는 개체)를 단일 변수나 요소로 확장할 수 있는 구문입니다.

사용자는 확장 구문을 사용하여 아래 구문에 따라 반복 가능한 객체를 확장할 수 있습니다.

으아아아

위 구문에서는 반복 가능한 "배열"의 모든 요소를 ​​array2 변수에 복사합니다.

확장 구문의 이점

확장 구문을 사용하면 몇 가지 이점이나 기능이 있습니다. -

  • 배열이나 개체를 복사하세요.

  • 배열 또는 객체 결합 및

  • 여러 요소를 함수 매개변수로 전달합니다.

위의 확장 구문 기능 각각에 대한 다양한 예를 살펴보겠습니다.

확산 구문을 사용하여 배열 복사

이 예에서는 확장된 synatx를 사용하여 한 배열의 요소를 다른 배열로 복사합니다. 단일 선형 코드가 모든 배열 요소를 array2에 복사하는 것을 볼 수 있습니다.

으아아아

배열이나 객체를 병합하려면 스프레드 구문을 사용하세요

JavaScript의 concat() 메서드를 사용하는 대신 array1 내부의 확장 구문을 사용하여 array1과 array2를 병합합니다. 또한 두 배열을 병합할 때 배열 요소의 순서를 변경합니다.

으아아아

확장 구문을 사용하여 여러 요소를 함수 인수로 전달

이 예에서는 세 개의 값을 매개변수로 사용하고 세 매개변수 모두의 합을 반환하는 add() 함수를 만들었습니다. 세 개의 값을 포함하는 배열을 만듭니다. 우리는 모든 배열 요소를 add() 함수에 매개변수로 전달하기 위해 확장된 구문을 사용했습니다.

으아아아

확장된 synatx를 사용하여 객체 복사

아래 예에서는 다양한 키-값 쌍을 포함하는 Sample_obj 개체를 만들었습니다. 확장된 구문을 사용하여 Sample_obj의 모든 키-값 쌍을 copy_object에 복사했습니다.

객체는 반복 가능하므로 확장 구문을 사용하여 객체를 확장할 수 있습니다.

으아아아

남은 구문

JavaScript에서 나머지 구문의 구문은 확장 구문과 동일합니다. 스프레드 구문을 사용한 확장과 달리 나머지 구문을 사용하면 단일 배열 또는 반복 가능한 요소를 수집할 수 있습니다.

일반적으로 개발자는 함수 매개변수의 총 개수가 정의되지 않거나 선택적 매개변수가 전달될 때 함수 매개변수에 대한 확장 구문을 사용합니다.

문법

사용자는 다음 구문에 따라 나머지 구문을 사용할 수 있습니다.

으아아아

위 구문에서는 params 배열에 모든 함수 매개변수를 수집했습니다.

이 예에서는 문자열 배열을 만들고 확장 구문을 사용하여 모든 배열 요소를 mergeString() 함수에 인수로 전달했습니다.

나머지 구문을 사용하여 params 배열에 mergeString() 함수의 모든 매개변수를 수집합니다. params 배열을 반복하고 params 배열의 각 요소를 FinalString 변수에 연결합니다.

으아아아

위의 예를 통해 사용자는 나머지 구문과 스프레드 구문의 차이점을 명확하게 이해할 수 있습니다.

ES6의 Spread 구문과 Rest 구문의 차이점:

확장 구문은 여러 요소나 속성을 배열로 수집하는 데 사용되는 나머지 구문과 다릅니다. 확장 구문은 요소 확장을 허용하고 나머지 구문은 요소 컬렉션을 허용합니다.

확장 구문 사용의 예로는 한 배열을 다른 배열로 복사, 두 배열 병합, 여러 배열 요소를 함수 인수로 전달, 한 개체의 속성을 다른 개체로 복사 등이 있습니다.

나머지 구문을 사용하는 예로는 요소 수집, 함수 매개변수 등이 있습니다.

다음 표는 ES6의 확산 구문과 나머지 구문의 차이점을 강조합니다. -

확장 구문

나머지 구문

확장 구문을 사용하여 반복 가능한 객체를 확장할 수 있습니다.

rest 구문을 사용하여 요소를 수집하고 수집된 모든 요소를 ​​반복 가능하게 만들 수 있습니다.

이를 사용하여 배열 또는 객체 형식으로 데이터를 확장할 수 있습니다.

필요한 형식으로 모든 요소를 ​​수집할 수 있습니다.

이를 사용하여 함수 내부에 매개변수를 전달할 수 있습니다.

이를 사용하여 함수 매개변수를 수집하거나 선택적 매개변수를 정의할 수 있습니다.

결론

JavaScript의 확장 구문은 반복 가능한 개체(예: 배열 또는 개체)를 단일 변수나 요소로 확장할 수 있는 구문입니다.

Expand 구문은 나머지 구문과 다릅니다. 확장 구문은 배열 복사, 배열 또는 객체 병합, 여러 요소를 함수 인수로 전달과 같은 작업을 수행하는 데 유용합니다.

나머지 구문은 여러 요소나 속성을 배열로 수집하는 등의 작업을 수행하는 데 유용합니다.

위 내용은 확장 구문의 이점과 ES6의 나머지 구문과 어떻게 다른지 설명하세요.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제