Rumah  >  Artikel  >  hujung hadapan web  >  Memperkenalkan kaedah biasa operator spread dalam JavaScript

Memperkenalkan kaedah biasa operator spread dalam JavaScript

藏色散人
藏色散人ke hadapan
2021-08-11 15:50:382349semak imbas

Pemahaman peribadi kaedah biasa...

.. . sebagai operasi lanjutan Simbol

merujuk kepada pengembangan di sini untuk tatasusunan atau rentetan atau pseudo-array (yang serupa dengan tatasusunan. Anda boleh menggunakan subskrip untuk mengeluarkan setiap item, dan terdapat keseluruhan Sambungan data atribut panjang (selepas ini dirujuk sebagai objek boleh dilalui) bermaksud untuk mengeluarkan setiap item dalam tatasusunan dan memisahkannya dengan (apabila digunakan, ia dipisahkan oleh ruang jika dicetak secara berasingan) .

  • ... Anda boleh mengembangkan tatasusunan satu dimensi, iaitu, anda hanya boleh mengalih keluar lapisan paling luar bagi []; dialih keluar daripada [], bukan A rentetan bukanlah tatasusunan atau apa-apa lagi, jadi mengikut format yang dipisahkan koma, anda boleh menghantarnya sebagai parameter formal sesuatu fungsi, atau anda boleh membungkusnya dengan [] di luarnya, dan menganggapnya sebagai tatasusunan sebagai pengembalian fungsi, tetapi ia tidak boleh dikembalikan secara langsung Anda boleh menggunakan output konsol.
… sebagai operator baki
<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>

Pengendali baki bermakna saya tidak tahu jumlah parameter yang ada, saya gunakan... untuk mewakili baki, begitu juga Ia hanya berfungsi dengan tatasusunan.
  • Dan hasil daripada kedua-dua kaedah ini ialah
  • array
  • , bukan array tanpa []. Terdapat dua kaedah:
  • Kaedah pertama: Semua parameter tidak diketahui dan saya tidak tahu berapa banyak yang perlu dilalui.
    • Jenis kedua: Terdapat satu atau lebih parameter yang diketahui, dan parameter yang selebihnya tidak diketahui.
Aplikasi ciri lain:
//  第一种所有参数都未知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"]   =>    结果是一个数组

Mengurai rentetan

Anda boleh menggunakan str.split("") atau [ . ..str]

Tukar tatasusunan pseudo kepada tatasusunan sebenar

Kerana ia boleh memaparkan objek boleh dilalui sebagai tatasusunan dengan mengalih keluar [], dan ia boleh digunakan pada tatasusunan pseudo, jadi ia mudah untuk memahami. Selepas menggunakan tatasusunan pseudo, tukar bentuk tatasusunan pseudo dan tambah [] padanya untuk menjadi tatasusunan sebenar, dan anda boleh memanggil kaedah tatasusunan sebenar. => […arr.]

Salinan cetek

Memandangkan ia digelung pada objek yang boleh dilalui, ia tidak akan mengubah tatasusunan asal, tetapi akan membuat operasi klon cetek, jadi ia boleh digunakan untuk salinan cetek tatasusunan. => […arr]

Perataan tatasusunan

Seperti yang dapat dilihat dari atas, apabila struktur tatasusunan adalah sangat mudah (dua dimensi), pengendali hamparan boleh menyelesaikan tatasusunan di dalam , dan gunakan concat untuk penyambungan. Tetapi apabila tatasusunan berbilang dimensi, ia tidak dapat menyelesaikan tatasusunan yang lebih dalam Ia perlu menggunakan operator penyebaran dan rekursi untuk mencapai ini.
  <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>

Kajian yang disyorkan: "

Tutorial asas Javascript"

Atas ialah kandungan terperinci Memperkenalkan kaedah biasa operator spread dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:csdn.net. Jika ada pelanggaran, sila hubungi admin@php.cn Padam