JavaScript中如何使用擴(kuò)展運(yùn)算符

這篇文章給大家介紹JavaScript中如何使用擴(kuò)展運(yùn)算符,內(nèi)容非常詳細(xì),感興趣的小伙伴們可以參考借鑒,希望對(duì)大家能有所幫助。

創(chuàng)新互聯(lián)云計(jì)算的互聯(lián)網(wǎng)服務(wù)提供商,擁有超過(guò)13年的服務(wù)器租用、成都西信服務(wù)器托管、云服務(wù)器、虛擬主機(jī)、網(wǎng)站系統(tǒng)開(kāi)發(fā)經(jīng)驗(yàn),已先后獲得國(guó)家工業(yè)和信息化部頒發(fā)的互聯(lián)網(wǎng)數(shù)據(jù)中心業(yè)務(wù)許可證。專(zhuān)業(yè)提供云主機(jī)、虛擬主機(jī)、域名與空間、VPS主機(jī)、云服務(wù)器、香港云服務(wù)器、免備案服務(wù)器等。

個(gè)人對(duì)…常用方法的理解

…作為擴(kuò)展運(yùn)算符

這里指的擴(kuò)展是針對(duì)數(shù)組或字符串或偽數(shù)組(就是類(lèi)似于數(shù)組這樣的可以用下標(biāo)將每一項(xiàng)取出來(lái),并且有總體長(zhǎng)度屬性的數(shù)據(jù),以下簡(jiǎn)稱(chēng)為可遍歷對(duì)象)的擴(kuò)展,代表的含義是將數(shù)組中的每一項(xiàng)取出來(lái),并用,進(jìn)行分隔(當(dāng)使用的時(shí)候是這樣,如果單獨(dú)打印的話(huà)是用空格分隔)。

  • …可以將一個(gè)一維數(shù)組進(jìn)行展開(kāi),即只能去掉最外面一層的[];

  • 他的結(jié)果就是數(shù)組被去掉[]的結(jié)果,不是字符串也不是數(shù)組也不是別的東西,所以按照它逗號(hào)分隔的方式,可以將它作為函數(shù)的形參傳遞也可以外面再套一個(gè)[],當(dāng)做數(shù)組作為一個(gè)函數(shù)的return,但是不能直接return,可以用console輸出。

<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"]的[]沒(méi)有去掉
    </script>

…作為剩余運(yùn)算符

  • 剩余運(yùn)算符的意思就是我不知道這個(gè)參數(shù)總共有多少個(gè),我用…表示剩余的,同樣它只適用于數(shù)組。

  • 而且這兩種方法得到的結(jié)果都是一個(gè)數(shù)組,而不是數(shù)組去掉[]。

  • 主要有以下兩種方法:

    • 第一種: 所有的參數(shù)都是未知的,不知道傳幾個(gè)。

    • 第二種: 有一個(gè)或多個(gè)已知參數(shù),其余參數(shù)未知。

//  第一種所有參數(shù)都未知function aa(...arr){
    console.log(arr);}aa(5,"sss",22)     //  (3) [5, "sss", 22]     =>    結(jié)果是一個(gè)數(shù)組//  第二種,有兩個(gè)已知參數(shù)function ff(a,b,...arr){
    console.log(arr)}ff(2,3,"str","111")    // (2) ["str", "111"]   =>    結(jié)果是一個(gè)數(shù)組

特性其他應(yīng)用:

分解字符串

可以用str.split("")也可以用[…str]

偽數(shù)組轉(zhuǎn)換為真數(shù)組

由于他可以將可遍歷對(duì)象用數(shù)組去掉[]的方法顯示出來(lái),而且可以對(duì)偽數(shù)組使用,所以很好理解對(duì)偽數(shù)組使用后將偽數(shù)組的形式轉(zhuǎn)變后,在加上[]就是真數(shù)組了,可以調(diào)用真數(shù)組的方法。 => […arr.]

淺拷貝

由于它是對(duì)一個(gè)可遍歷的對(duì)象使用循環(huán)過(guò)來(lái)的,所以它不會(huì)改變?cè)瓟?shù)組,會(huì)進(jìn)行一個(gè)淺克隆的操作,因此可以用于數(shù)組的淺拷貝。 => […arr]

數(shù)組扁平化

  <script>
        // 簡(jiǎn)單的二維數(shù)組(一個(gè)數(shù)組里面又套了一個(gè)數(shù)組  =>  二維)
        let arr = [
            5,
            "str",
            [1,2,3],
            ["hello","world"],
        ];

        // 三維數(shù)組(一個(gè)數(shù)組里面套一個(gè)數(shù)組,里面又套一個(gè)數(shù)組)
        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>

關(guān)于JavaScript中如何使用擴(kuò)展運(yùn)算符就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到。

文章名稱(chēng):JavaScript中如何使用擴(kuò)展運(yùn)算符
分享URL:http://muchs.cn/article14/pippde.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供響應(yīng)式網(wǎng)站App設(shè)計(jì)、網(wǎng)站維護(hù)、定制開(kāi)發(fā)網(wǎng)站收錄、企業(yè)建站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

綿陽(yáng)服務(wù)器托管