1.map
let arrNew = arr.map(x => x*2)
console.log(arr); // [1, 2, 3, 4]
console.log(arrNew); // [2, 4, 6, 8]
- map() 方法返回一個新數組,數組中的元素爲原始數組元素調用函數處理後的值。
- map() 方法按照原始數組元素順序依次處理元素。
- 注意: map() 不會對空數組進行檢測。
- 原數組保持不變,返回新數組
2.forEach
arr.forEach( item => item*2 ) // return undefined
console.log(arr); // [1, 2, 3, 4]
- 原數組改變,沒有返回值
3.filter 過濾元素
let arr = [1, 2, 3, 4, 5]
const isBigEnough = value => value >= 3
let newArr = arr.filter(isBigEnough )
console.log(newArr); // [3, 4, 5]
- 原數組不改變,將滿足條件的元素作爲一個新數組返回
4.find 返回通過測試的數組的第一個元素的值
在第一次調用 callback 函數時會確定元素的索引範圍,因此在 find 方法開始執行之後添加到數組的新元素將不會被 callback 函數訪問到。被刪除的元素仍舊會被訪問到。
var arr = [1,2,3,4,5,6,7];
var ar = arr.find(function(elem){
return elem>5;
});
console.log(ar);//6
console.log(arr);//[1,2,3,4,5,6,7]
find()方法爲數組中的每個元素都調用一次函數執行,當數組中的元素在測試條件時返回true,find()返回符合條件的元素,之後的值不會再執行函數。如果沒有符合條件的元素則返回undefined。
5.every 是否所有元素都符合條件
var ages = [32, 33, 16, 40];
function checkAdult(age) {
return age >= 18;
}
console.log(ages.every(checkAdult)) // false
- 不改變原數組。如果有一個元素不滿足,返回false;全部滿足才返回true
6.some 是否存在元素符合條件
var ages = [3, 10, 18, 20];
function checkAdult(age) {
return age >= 18;
}
console.log(ages.some(checkAdult)) // true
- 不改變原數組。如果有一個元素滿足,返回true;全部不滿足則返回false
7.reduce 所有元素返回調用函數,返回值爲最後結果
let arr = [1,2,3,4];
const add1 = (a,b) => a+b;
let arrNew = arr.reduce(add1);
console.log(arrNew); // 10
- 不改變原數組,只是返回最後的調用結果。
- 返回單個值
8.push 在數組最後添加新元素
let arr = [1,2,3,4,5];
arr.push(6); // console.log(arr.push(6)) => return 6
console.log(arr); // [1, 2, 3, 4, 5, 6]
- 改變數組長度。返回數組的長度
9.pop 在數組最後刪除一個元素
let arr = [1,2,3,4,5];
console.log(arr.pop()); // 5
console.log(arr); // [1, 2, 3, 4]
console.log(arr.length); // 4
- 改變數組長度。返回被刪除的元素
10.shift 在數組前刪除第一個元素
let arr = [1,2,3,4,5];
console.log(arr.shift()); // 1
console.log(arr); // [2, 3, 4, 5]
console.log(arr.length); // 4
- 改變數組長度。返回被刪除元素
11.unshift 將一個/多個元素添加到數組開頭
let arr = [1,2,3,4,5];
console.log(arr.unshift(6,7)); // 7 返回加進去的第一個數
console.log(arr); // [6, 7, 1, 2, 3, 4, 5] 先把7加進去,再加7
console.log(arr.length); // 7
- 改變數組長度。返回加進數組的第一個數
12.isArray()
判斷一個對象是不是數組,返回的是布爾值
13.concat 拼接數組
let arr1 = [1, 2, 3]
let arr2 = [4, 5]
let arr = arr1.concat(arr2)
console.log(arr) //[1, 2, 3, 4, 5]
14.將數組轉化成字符串
- Array.toString()
let arr = [1, 2, 3, 4, 5];
let str = arr.toString()
console.log(str) // 1,2,3,4,5
2.Array.join() :可以設置元素間的間隔
let arr = [1, 2, 3, 4, 5];
let str1 = arr.join(""); // 12345
let str2 = arr.join('--'); // 1--2--3--4--5
let str3 = arr.join('##'); // 1##2##3##4##5
補充:字符串分割成字符串數組 split
stringObject.split(separator,howmany)
// separator:分隔符,字符串或正則表達式; howmany 返回的數組的最大長度
"2:3:4:5".split(":") //將返回["2", "3", "4", "5"]
"|a|b|c".split("|") //將返回["", "a", "b", "c"]
// 把句子分割成單詞:
var words = sentence.split(' ')
// 或者使用正則表達式作爲 separator:
var words = sentence.split(/\s+/) // \s是不可見字符,空格、換行符、製表符等。
15.splice 萬能,實現增刪改
// 刪除 splice(1,3) 參數:刪除位置;刪除個數
let arr = [1, 2, 3, 4, 5];
let arr1 = arr.splice(1,3)
console.log(arr); // [1, 5]
console.log(arr1); // [2, 3, 4] 改變原數組,返回被刪除的元素
// 插入 splice(2,0,"hhh") 參數:插入位置;0:不刪除;插入內容
let arr = [1, 2, 3, 4, 5];
var arr1 = arr.splice(2,0,"hhh")
console.log(arr); // [1, 2, "hhh", 3, 4, 5]
console.log(arr1); // [] 沒有返回值,因爲沒有刪除元素
// 清空
let arr = [1, 2, 3, 4, 5];
arr.splice(0)
console.log(arr); // []
16.slice 從數組指定位置輸出新數組
let arr = [1, 2, 3, 4, 5];
console.log(arr.slice(1, 4)); // [2, 3, 4]
console.log(arr); // [1, 2, 3, 4, 5]
- 不改變數組,返回新數組
- slice(1):從位置1開始
- slice(1,4):從位置1開始,到位置4-1。 區別於splice
17.sort 排序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
// Apple,Banana,Mango,Orange 默認升序
let arr = [1, 2, 3, 4, 5];
arr.sort(function (a,b) {
return b-a; // b-a:降序;a-b:升序。
})
console.log(arr); // [5, 4, 3, 2, 1]