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

Memperkenalkan kaedah biasa operator spread dalam JavaScript

藏色散人
Lepaskan: 2021-08-11 15:50:38
ke hadapan
2433 orang telah melayarinya

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>
Salin selepas log masuk

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"]   =>    结果是一个数组
Salin selepas log masuk

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>
Salin selepas log masuk

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!

Label berkaitan:
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan