js陣列型別

indexman發表於2017-10-13
JS陣列型別
js陣列型別:

陣列檢測

1.判斷變數是否為陣列型別：
arr1 instanceof Array
Array.isArray(arr1);
true

轉換方法
toString()方法，以便返回陣列的字串表示
valueOf()返回的還是陣列
由於 alert()要接收字串引數，所以它會在後臺呼叫 toString()方法，由此
會得到與直接呼叫 toString()方法相同的結果

var colors = ["red", "blue", "green"]; // 建立一個包含 3 個字串的陣列
alert(colors.toString()); // red,blue,green
alert(colors.valueOf()); // red,blue,green
alert(colors); // red,blue,green

join()方法只接收一個引數，即用作分隔符的字串，然後返回包含所有陣列項的字串
var colors = ["red", "green", "blue"];
alert(colors.join(",")); //red,green,blue
alert(colors.join("||")); //red||green||blue

棧方法：
push&pop
push()方法可以接收任意數量的引數，把它們逐個新增到陣列末尾，並返回修改後陣列的長度;
pop()方法則從陣列末尾移除最後一項，減少陣列的 length 值，然後返回移除的項

var colors = new Array(); // 建立一個陣列
var count = colors.push("red", "green"); // 推入兩項
alert(count); //2
var removedElement=arr1.pop();
alert(removedElement);  //green

佇列方法：
push &shift
var colors = new Array(); //建立一個陣列
var count = colors.push("red", "green"); //推入兩項
alert(count); //2

colors.push("yellow");
3
colors.shift();
"red"

在陣列的前端新增項，從陣列末端移除項
colors.unshift("black");

重新排序方法：
reverse()和 sort()

sort()方法可以接收一個比較函式作為參
數，以便我們指定哪個值位於哪個值的前面

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

var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); //0,1,5,10,15

操作方法
concat()方法可以基於當前陣列中的所有項建立一個新陣列
var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
alert(colors); //red,green,blue
alert(colors2); //red,green,blue,yellow,black,brown

slice()，它能夠基於當前陣列中的一或多個項建立一個新陣列
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors2); //green,blue,yellow,purple
alert(colors3); //green,blue,yellow

如果 slice()方法的引數中有一個負數，則用陣列長度加上該數來確定相應的位
置。例如，在一個包含 5 項的陣列上呼叫 slice(-2,-1)與呼叫 slice(3,4)得到的
結果相同。如果結束位置小於起始位置，則返回空陣列。


splice()方法，這個方法恐怕要算是最強大的陣列方法了，它有很多種用法
 刪除：可以刪除任意數量的項，只需指定 2 個引數：要刪除的第一項的位置和要刪除的項數。
例如， splice(0,2)會刪除陣列中的前兩項。
 插入：可以向指定位置插入任意數量的項，只需提供 3 個引數：起始位置、 0（要刪除的項數）
和要插入的項。如果要插入多個項，可以再傳入第四、第五，以至任意多個項。例如，
splice(2,0,"red","green")會從當前陣列的位置 2 開始插入字串"red"和"green"。
 替換：可以向指定位置插入任意數量的項，且同時刪除任意數量的項，只需指定 3 個引數：起
始位置、要刪除的項數和要插入的任意數量的項。插入的項數不必與刪除的項數相等。例如，
splice (2,1,"red","green")會刪除當前陣列位置 2 的項，然後再從位置 2 開始插入字串
"red"和"green"。
splice()方法始終都會返回一個陣列，該陣列中包含從原始陣列中刪除的項（如果沒有刪除任何
項，則返回一個空陣列）。下面的程式碼展示了上述 3 種使用 splice()方法的方式。
var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); // 刪除第一項
alert(colors); // green,blue
alert(removed); // red，返回的陣列中只包含一項
removed = colors.splice(1, 0, "yellow", "orange"); // 從位置 1 開始插入兩項
alert(colors); // green,yellow,orange,blue
alert(removed); // 返回的是一個空陣列
removed = colors.splice(1, 1, "red", "purple"); // 插入兩項，刪除一項
alert(colors); // green,red,purple,orange,blue
alert(removed); // yellow，返回的陣列中只包含一項

位置方法
indexOf()和 lastIndexOf()
indexOf()方法從陣列的開頭（位置 0）開始向後查詢， lastIndexOf()方法則從陣列的末尾開始向前查詢，沒找到的情況下返回-1
var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3
alert(numbers.lastIndexOf(4)); //5
alert(numbers.indexOf(4, 4)); //5
alert(numbers.lastIndexOf(4, 4)); //3
var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];
var morePeople = [person];
alert(people.indexOf(person)); //-1
alert(morePeople.indexOf(person)); //0


迭代方法
 every()：對陣列中的每一項執行給定函式，如果該函式對每一項都返回 true，則返回 true。
 filter()：對陣列中的每一項執行給定函式，返回該函式會返回 true 的項組成的陣列。
 forEach()：對陣列中的每一項執行給定函式。這個方法沒有返回值。
 map()：對陣列中的每一項執行給定函式，返回每次函式呼叫的結果組成的陣列。
 some()：對陣列中的每一項執行給定函式，如果該函式對任一項返回 true，則返回 true。
以上方法都不會修改陣列中的包含的值。
在這些方法中，最相似的是 every()和 some()，它們都用於查詢陣列中的項是否滿足某個條件。
對 every()來說，傳入的函式必須對每一項都返回 true，這個方法才返回 true；否則，它就返回
false。而 some()方法則是隻要傳入的函式對陣列中的某一項返回 true，就會返回 true。請看以下
例子。
var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item, index, array){
return (item > 2);
});
alert(everyResult); //false
var someResult = numbers.some(function(item, index, array){
return (item > 2);
});
alert(someResult); //true

看一看 filter()函式，它利用指定的函式確定是否在返回的陣列中包含某一項。例如，要
返回一個所有數值都大於 2 的陣列，可以使用以下程式碼。
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]

map()也返回一個陣列，而這個陣列的每一項都是在原始陣列中的對應項上執行傳入函式的結果。
例如，可以給陣列中的每一項乘以 2，然後返回這些乘積組成的陣列，如下所示。
var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
return item * 2;
});
alert(mapResult); //[2,4,6,8,10,8,6,4,2]

最後一個方法是 forEach()，它只是對陣列中的每一項執行傳入的函式。這個方法沒有返回值，
本質上與使用 for 迴圈迭代陣列一樣。來看一個例子。
var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
alert(item);
});

歸併方法
reduce()和 reduceRight()
reduce()方法從陣列的第一項開始，逐個遍歷到最後。而 reduceRight()則從陣列的最後一項開始，向前遍歷到第一項
var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
return prev + cur;
});
alert(sum); //15


相關文章