JAVASCRIPT引用類型之Array類型(三)

Array類型

ECMAScript爲操作已經包含在數組中的項提供了很多方法。

concat() 方法

concat() 方法可以基於當前數組中的所有項創建一個新數組。具體來說,這個方法會先創建當前數組一個副本,然後將接收到的參數添加到這個副本的末尾,最後返回新構建的數組。在沒有給concat() 方法傳遞參數的情況下,它只是複製當前數組並返回副本。如果傳遞給concat() 方法的是一或多個數組,則該方法會將這些數組中的每一項都添加到結果數組中。如果傳遞的值不是數組,這些值就會被簡單地添加到結果數組的末尾。如下:

var colors = ["red", "green", "blue"];
var colors2 = colors.concat();
alert("colors -> " + colors);                                   //colors -> red,green,blue
alert("colors2 -> " + colors2);                                 //colors2 -> red,green,blue

var colors3 = colors.concat("yellow");
alert("colors -> " + colors);                                   //colors -> red,green,blue
alert("colors3 -> " + colors3);                                 //colors3 -> red,green,blue,yellow

var colors4 = colors.concat(["black", "brown"]);
alert("colors -> " + colors);                                   //colors -> red,green,blue
alert("colors4 -> " + colors4);                                 //colors4 -> red,green,blue,black,brown

var colors5 = colors.concat("yellow", ["black", "brown"]);
alert("colors -> " + colors);                                   //colors -> red,green,blue
alert("colors5 -> " + colors5);                                 //colors5 -> red,green,blue,yellow,black,brown

var colors6 = colors.concat("yellow", 6);
alert("colors -> " + colors);                                   //colors -> red,green,blue
alert("colors6 -> " + colors6);                                 //colors6 -> red,green,blue,yellow,6

以上代碼開始定義了一個包含3個值的數組colors。 然後,基於colors調用了concat()方法,通過往concat()方法中傳入不同的參數得到不同的返回結果, 但是原數組colors的值沒有改變

slice() 方法

下一個方法是slice() 方法,它能夠基於當前數組中一或多個項創建一個新數組。slice() 方法可以接收一個或兩個參數,即要返回項的起始位置和結束位置。在只有一個參數的情況下,slice() 方法返回從該參數指定位置開始到當前數組末尾的所有項。如果有兩個參數,該方法返回起始和結束位置之間的項--但不包括結束位置的項(類似於數學中的前閉後開 [1,5) )。注意,slice()方法不會影響原始數組。如下:

var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
alert(colors);                      //red,green,blue,yellow,purple
alert(colors2);                     //green,blue,yellow,purple

var colors3 = colors2.slice(1, 4);
alert(colors);                      //red,green,blue,yellow,purple
alert(colors3);                     //blue,yellow,purple

splice() 方法

splice()方法是要算是最強大數組方法了, 它有很多種用法,splice()的主要用途是想數組中部插入項,但使用這種方法的方式則有如下3種:

刪除:可以刪除任意數量的項,只需要指定2個參數:要刪除的第一項的位置和要刪除的項數。例如,splice(0, 2)會刪除數組中的前兩項。

插入:可以向指定位置插入任意數量的項,只需提供3個參數:起始位置, 0(要刪除的項數)和要插入的項。如果要插入多個項,可以在傳入第四,第五,以至於任意多個項。例如,splice(2, 0, "red", "green")會從當前數組的位置2開始並插入字符串“red”和“green”.

替換:可以向指定位置插入任意數量的項,且同事刪除任意數量的項,只需要指定3個參數:起始位置,要刪除的項數和要插入的任意數量的項。插入的項數不必與刪除的項數相等。例如,splice(2, 1, "red", "green")會刪除當前數組位置2的項,然後再從位置2開始插入字符串“ren” 和 “green”。

splice()方法始終都會返回一個數組,該數組中包含從原始數組中刪除的項(如果沒有刪除任何想,則返回一個空數組)。如下演示:

var colors = ["red", "green", "blue", "yellow", "purple"];
alert(colors);                                      //red,green,blue,yellow,purple
//刪除
var colors2 = colors.splice(2, 1);
alert("colors -> " + colors);                      //colors -> red,green,yellow,purple
alert(typeof colors2);                              //object
alert("colors2 -> " + colors2);                   //colors2 -> blue

colors = ["red", "green", "blue", "yellow", "purple"];
alert(colors);                                      //red,green,blue,yellow,purple
//插入
var colors3 = colors.splice(2, 0, "black", "pink");
alert("colors -> " + colors);                      //colors -> red,green,black,pink,blue,yellow,purple
alert(typeof colors3);                              //object
alert("colors3 -> " + colors3);                    //colors3 ->

colors = ["red", "green", "blue", "yellow", "purple"];
alert(colors);                                      //red,green,blue,yellow,purple
//替換
var colors4 = colors.splice(2, 1, "black", "pink");
alert("colors -> " + colors);                      //ccolors -> red,green,black,pink,yellow,purple
alert(typeof colors4);                              //object
alert("colors4 -> " + colors4);                    //colors4 -> blue

通過上述可以知道splice()方法的用法, 但是需要注意的是: splice()方法會修改原來的數組

 

總結: concat()方法和slice()方法是在原來數組的副本上進行操作, 而splice()方法則是針對原數組進行操作, 所以concat() 和 slice() 方法不會修改原數組的值, 而splice() 方法則會修改原數組的值。

 

備註: 摘取自《JAVASCRIPT高級程序設計:第3版》

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章