1. 程式人生 > 其它 >ES5-新增陣列方法

ES5-新增陣列方法

 indexOf方法 (查詢某個元素在陣列中第一次出現的位置)

語法:arr.indexOf(元素,[開始查詢的起始下標]);

程式碼示範:

var arr = [1,3,5,7,7,5,3,1];
console.log(arr.indexOf(5)); // 2 - 查詢數字5在陣列中第一次出現的下標
console.log(arr.lastIndexOf(5)); // 5 - 查詢數字5在陣列中最後一次出現的位置
console.log(arr.indexOf(5,3)); // 5 - 從下標2開始查詢數字5在陣列中第一次出現的位置
console.log(arr.lastIndexOf(5,4)); //
2 - 從下標4開始查詢數字5在陣列中最後一次出現的下標 console.log(arr.indexOf("5")); // -1 - 陣列中全是數字,找不到字串5,所以返回-1

forEach方法(用於遍歷陣列)

語法:

arr.forEach(function(值, 下標, 當前陣列){
    // 程式碼段
});
# 在這個方法中需要傳入一個函式引數,這個函式的引數說明如下:
# 引數1:陣列遍歷出來的每個值
# 引數2:可選項。陣列遍歷出來的每個值對應的下標
# 引數3:可選項。被遍歷的當前陣列

程式碼示範:

var arr = [1, 2, 3, 4, 5];
arr.forEach(
function(x, index, a){ console.log(x + '|' + index + '|' + (a === arr)); }); // 輸出為: // 1|0|true // 2|1|true // 3|2|true // 4|3|true // 5|4|true

使用說明:

這個方法沒有返回值,返回值為undefined,不會改變原來陣列的值。

 

map方法(遍歷陣列,並將每個元素經過函式處理後,形成新的元素,所有新元素組成新陣列返回)

語法:

arr.map(function(值,下標,當前陣列){
return 新的值 - 通常新的值是由舊的值處理以後得到
});

程式碼示範:

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
    return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]

使用說明:這個方法主要用於以同樣的規則處理陣列中的每個值,並組成新的陣列返回

 

filter方法 (將陣列中滿足指定條件的值,組成新的陣列返回)

語法:

arr.filter(function(值, 下標, 當前陣列){
    return 篩選條件
});

程式碼示範:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(v, index) {
    return v>5
}); 
console.log(arr2); //[6, 7, 8, 9, 10]

使用說明:

使用方法和功能跟map方法很像,只是執行規則不一樣。map方法中的函式,用於返回新的元素,而filter方法中的函式,根據返回true或false來篩選元素