JavaScript의 스프레드 연산자의 일반적인 방법 소개

...일반적인 방법에 대한 개인적인 이해

...확장 연산자로서

여기서 확장은 배열, 문자열 또는 의사 배열을 의미합니다. 배열과 유사함) 아래 첨자를 사용하여 각 항목을 꺼낼 수 있으며 데이터(이하 탐색 가능한 개체라고 함)의 전체 길이 속성을 확장할 수 있습니다. 즉, 배열의 각 항목을 꺼내서 다음과 같이 구분합니다. (사용시 이런 경우이며, 별도로 인쇄할 경우 공백으로 구분됩니다.)

• ...1차원 배열을 확장할 수 있습니다. 즉, 가장 바깥쪽의 []만 제거할 수 있습니다.
• 결과는 문자열이 아닌 배열에서 []를 제거한 결과입니다. 또는 다른 모든 것. 따라서 쉼표로 구분된 방법에 따라 이를 함수의 형식 매개변수로 전달하거나 외부에 []를 사용하여 함수 반환으로 배열로 사용할 수 있습니다. 이지만 직접 반환할 수 없으며 콘솔을 통해 출력할 수 있습니다.

<script>
        let arr = [
            5,
            "str",
            [1,2,3],
            ["hello","world"],
        ];

        function fn(arr){
            console.log(...arr);   
            return [...arr]        
        }
        function fo(...arr){
            console.log(arr);
        }
        // function foo(arr){
        //     return ...arr;  //    Expression expected.
        // }
        console.log(fn(arr));     //  5 "str" (3) [1, 2, 3] (2) ["hello", "world"]
                                  //  (4) [5, "str", Array(3), Array(2)]
		//   外面的[]去掉了，但是里面的[1,2,3]、["hello","world"]的[]没有去掉
    </script>

…나머지 연산자

• 나머지 연산자는 총 매개변수의 개수를 알 수 없다는 의미로 나머지를 표현하기 위해...를 사용하고 배열에만 적용됩니다.
• 그리고 이 두 가지 방법으로 얻은 결과는 []가 없는 배열이 아니라 배열입니다.
• 주로 다음 두 가지 방법이 있습니다.
  • 첫 번째: 모든 매개 변수를 알 수 없으며 몇 개를 통과해야 할지 모르겠습니다.
  • 두 번째 유형: 알려진 매개변수가 하나 이상 있고 나머지 매개변수는 알 수 없습니다.

//  第一种所有参数都未知function aa(...arr){
    console.log(arr);}aa(5,"sss",22)     //  (3) [5, "sss", 22]     =>    结果是一个数组//  第二种，有两个已知参数function ff(a,b,...arr){
    console.log(arr)}ff(2,3,"str","111")    // (2) ["str", "111"]   =>    结果是一个数组

기타 기능 응용:

문자열 분해

str.split("") 또는 [...str]

의사 배열을 사용하여 실제 배열로 변환할 수 있습니다

문자열을 변환할 수 있기 때문입니다. 순회 가능한 객체 배열에서 []를 제거하는 방법이 표시되어 있으며 의사 배열에도 사용할 수 있으므로 의사 배열을 사용한 후 의사 배열의 형태를 변환한 후 []를 추가하는 것이 실제임을 이해하기 쉽습니다. 배열이며 실제 배열의 메서드를 호출할 수 있습니다. => […arr.]

Shallow copy

순회 가능한 객체에 루프를 사용하기 때문에 원본 배열을 변경하지 않고 얕은 복제 작업을 수행하므로 배열 Shallow copy에 사용할 수 있습니다. => […arr]

Array flattening

  <script>
        // 简单的二维数组（一个数组里面又套了一个数组  =>  二维)
        let arr = [
            5,
            "str",
            [1,2,3],
            ["hello","world"],
        ];

        // 三维数组（一个数组里面套一个数组，里面又套一个数组）
        let arr1 = [
            5,
            "str",
            [
                1,2,3,
                ["ccc","dddd"]
            ],
            ["hello","world"],
        ];


        function flatten(arr){
            return [].concat(...arr);
        }

        function flatten1(arr){
            return [].concat(...arr.map(x => Array.isArray(x) ? flatten1(x) : x));
        }
        console.log(flatten(arr));    // (7) [5, "str", 1, 2, 3, "hello", "world"]
        console.log(flatten1(arr));   // (7) [5, "str", 1, 2, 3, "hello", "world"]
        console.log(flatten(arr1));   // (8) [5, "str", 1, 2, 3, Array(2), "hello", "world"]
        console.log(flatten1(arr1));  // (9) [5, "str", 1, 2, 3, "ccc", "dddd", "hello", "world"]
    </script>

위에서 볼 수 있듯이 배열 구조가 매우 간단한 경우(2차원) 스프레드 연산자는 배열 내부를 풀고 concat을 사용하여 접합할 수 있습니다. 그러나 배열이 다차원인 경우 더 깊은 배열을 해결할 수 없습니다. 이를 달성하려면 확산 연산자와 재귀를 사용해야 합니다.

추천 학습: "javascript 기본 튜토리얼"

위 내용은 JavaScript의 스프레드 연산자의 일반적인 방법 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!