數組的方法

今天來總結一下數組的方法

valueOf()方法返回數組自己
toString()方法返回數組的每一項的字符串形式拼接而成以逗號隔開。
alert()要接收字符串參數，因此會調用toString()方法。
join()方法：使用不一樣的分隔符來構建這個字符串。

var color=["1","2","3"]
color.join("|")
"1|2|3"

• 棧方法

LIFO（後進先出），插入和移除所有在棧頂。
插入push(),向數組的末端添加項，接收任意數量的參數，返回當前數組的長度。
移除pop()，從數組末尾移除最後一項，放回移除的項。

• 隊列方法

FIFO（先進先出），在列表的後端插入，前端移除。
前端移除shift()，移除數組的第一項並返回該項。
前端添加unshift()，在數組的前端添加項。

• 排序方法

反轉數組項的順序：reverse()
sort():sort()方法會調用每一個數組項toString()的轉型方法，而後比較獲得的字符串。即便數組中的每一項都是數值，sort()方法比較的也是字符串。
若想用它來進行數字的升序降序排列，能夠利用arr.sort(compare)，其中compare是自定義函數。
升序

function comapre(value1,value2){
if(value1<value2){
return -1;
}else if(value1>value2){
return 1;
}else{
return 0;
 }
}

對於數值類型或者valueOf()方法會返回數值類型的對象類型，可使用更簡單的比較函數：
function compare(value1,value2){
return value2-value1;
}

• 操做方法

concat()：該方法基於當前數組中的全部項新建一個當前數組的副本，而後將接收到的參數添加到數組末尾，返回新構建的數組。參數不必定是數組，也能夠是其餘類型的值，都會被添加到數組末尾。

var color=["1","2"];
var color2=color.concat(3,[4,"5"]);//["1", "2", 3, 4, "5"]

slice():基於當前數組的一個或多個項新建一個數組，該方法接受兩個參數，要返回項的起始和結束位置，不會影響原始數組。
splice():該方法能夠實現：
刪除（傳入兩個參數，要刪除的第一項和項數）；
插入（傳入三個參數，起始項，要刪除的項數（0），要插入的項）；
替換（傳入三個參數，起始項，要刪除的項數，要插入的熱議數量項）。
注意：該方法返回的是數組中刪除的項，若是沒有刪除返回空數組，而且會改變原數組。

var color=["red","yellow","blue"];
var removed=color.splice(0,1);
alert(color);//yellow,blue
alert(removed);//red

• 位置方法

indexOf()和lastindexOf()，返回要查找的項在數組中的位置。

• 迭代方法

每一個方法都接收2個參數，要運行的函數和該函數的做用域對象，傳入方法中的函數接收3個參數，即數組項的值，該項在數組中的位置及數組對象自己。
every():傳入的函數對數組的每一項都返回true，則返回true。
some():傳入的函數對數組的任一一項都返回true，則返回true。
filter():對數組中的每一項執行傳入的函數，返回該函數會返回true的項。
map()：對數組中的每一項執行函數，並將每一項的返回結果組成數組。
forEach()：對數組中的每一項執行函數，該方法沒有返回值。

var ages = [32, 33, 16, 40];

function checkAdult(age) {
    return age >= 18;
}

function myFunction() {
    document.getElementById("demo").innerHTML = ages.every(checkAdult);
}

<button onclick="numbers.forEach(myFunction)">點我</button>
<p id="demo"></p>
 
<script>
demoP = document.getElementById("demo");
var numbers = [4, 9, 16, 25];
 
function myFunction(item, index) {
    demoP.innerHTML = demoP.innerHTML + "index[" + index + "]: " + item + "<br>"; 
}
</script>

• 迭代方法

reduce()和reduceRight():
迭代數組的全部項，獲得最終的返回值。

數組的擴展

• Array.from()

Array.from():將相似數組的對象和可遍歷的對象轉爲真正的數組。

let arraylike={
"0":"a",
"1":"b",
"2":"c",
length:3
};

ES5寫法：[].slice.call(arraylike);//["a","b","c"]
ES6寫法：Array.from(arraylike);//["a","b","c"]
DOM操做返回的NodeList集合以及arguments對象也是相似數組的對象，能夠用這兩種方法將其轉爲真正的數組。

Array.from(document.querySelectorAll('p'))

• Array.of()

Array.of():將一組值轉爲數組。

Array.of(1,2,3);//[1,2,3]

數組賦值

在JS中，變量是值傳遞，而數組是引用傳遞。

舉例以下：

//變量的賦值傳遞
var a = 2;    //變量
var b = a;
a = 3;
alert(b);    //結果b=2

//數組的賦值傳遞
var a = [1,2,3];    //數組
var b = a;
b [0] = 5;
alert(a);     //結果a=[5,2,3]

以上是比較常見的簡單JS語法，但在面試時可能會遇到一些更加細膩而且容易出錯的問題。

var a=[1,2,3]; //數組
var b=a;
a=[4,5,6]; //改變的是引用
alert(b);  //結果[1,2,3]

應該有不少同窗會這樣想：由於數組是引用類型，應該是傳遞的是引用，因此 b也是[4,5,6]，因而錯了。正確答案是b=[1,2,3]。這是爲何嗎？
首先強調一點概念：
數組名存放的內容是地址。
如今來詳細的解讀上面的程序：
var a= [1,2,3]; //定義一個數組並賦值，此時a 指向[1，2，3]數組對象。

var b = a; //由於a是數組名，表示的是地址。將a的地址付給b，此時b也指向[1,2,3]數組對象。
a = [4,5,6]; //此時a指向數組對象[4，5，6],改變的是a的指向對象，並無改變[1,2,3]數組對象自己。
看到這裏，以前有疑惑的同窗應該豁然開朗了吧。，再補充一題讓你們更充分的理解：

var a = [1,2,3];
var b = a;
a.pop(); //pop()方法 ：刪除數組對象的最後一個元素  這裏是直接改變的數組對象[1,2,3]
alert(b);  //結果b=[1,2]