Array 的一些常用 API

unshift、push、shift、pop

• 這4個方法都會改變原數組
• unshift() 從前面添加元素，push() 從後面追加元素，返回數組長度
• shift() 刪除第0個元素，pop() 刪除最後一個元素，返回被刪除的元素

slice

• 不改變原數組
• slice(m, n)返回原數組索引m（包含）到n（不包含）的元素數組。不傳參數默認全部截取，只傳一個參數，從該位置截取到末位。類似於String.prototype.substring

let arr = [1,2,3,4,5]
console.log(arr.slice()); // [ 1, 2, 3, 4, 5 ]
console.log(arr.slice(1)); // [ 2, 3, 4, 5 ]
console.log(arr.slice(2,4)); // [ 3, 4 ]
console.log(arr); // [1,2,3,4,5]

splice

• 改變原數組。
• splice(m,n,e1,e2,e3) 從索引m（包括）到n（不包括）的元素刪除數組，再在該位置處添加e1，e2，e3。若n傳入0，則只增加；若只傳m和n，則只刪除；若只傳m，則從m位置刪除到末位。放回刪除元素數組

let arr = [1,2,3,4,5];
console.log(arr.splice(2), arr); // [ 3, 4, 5 ] [ 1, 2 ]
console.log(arr.splice(0,1,2), arr); // [ 1 ] [ 2, 2, 3, 4, 5 ]

concat

• 拼接，不改變原數組

let arr = [1,2,3], arr1 = [4];
console.log(arr.concat(arr1, 5), arr); // [ 1, 2, 3, 4, 5, ] [ 1, 2, 3 ]
console.log([...arr, ...arr1, 5]); // [ 1, 2, 3, 4, 5 ] （對象也可以這樣拼接，但重複的會覆蓋，相當與 Object.assign）

of 和 from

• of()類似於new Array()，但後者如果傳入一個參數，則是設置數組長度。
• from() 把僞數組轉換爲真數組，類似於[].slice.call()（或者寫成Array.prototype.slice.call()）
• 僞數組有DOM集、arguments、{0: 'zero', 1: 'one', length: 2}

Array.of(1,2,3,4); // [ 1, 2, 3, 4 ]
Array.from({0: 'zero', 1: 'one', length: 2}); // [ 'zero', 'one' ]

判斷數組的方法有

• xx instanceof Array
• Array.isArray()
• Object.prototype.toString.call() === '[object Array]'

這裏補充一點判斷類型的技巧：

• typeof操作符可以判斷出number、boolean、string、function和undefined，而不能判斷處具體的Object類型。

  • 判斷Array要使用Array.isArray(arr)；
  • 判斷null請使用myVar === null；
  • 判斷某個全局變量是否存在用typeof window.myVar === 'undefined'；
  • 函數內部判斷某個變量是否存在用typeof myVar === 'undefined'
• 不必把任意類型轉換爲boolean再判斷，因爲可以直接寫if (myVar) {...}，如果需要轉換可以用 !!myVar
• 不要使用new Number()、new Boolean()、new String() 創建包裝對象；
• 用parseInt()或parseFloat()來轉換任意類型爲Number；用String()來轉換任意類型爲String，或者直接調用某個對象的toString()方法；

indexOf 和 includes

• indexOf() 返回索引，不存在就返回 -1。inclues()返回布爾值。
• NaN 不能通過indexOf()判斷，它是通過“===”比較的。

arr = [1, '2', null, NaN];
arr.indexOf(NaN); // -1
arr.includes(NaN); // true

filter、find 和 findIndex

• filter() 返回數組。find() 返回值，不存在就返回 undefined。 findIndex() 返回第一個匹配到的索引，不存在就返回 -1。

// let arr = [1, '2', null, NaN];
// arr.filter(item => typeof item === 'number'); // [1, NaN]
// arr.find(item => typeof item === 'number'); // 1
// arr.findIndex(item => typeof item === 'number'); // 0

some 和 every

• 返回布爾值
• some()用於檢測數組中的元素是否有滿足指定條件的；every()用於檢測數組中所有元素是否都符合指定條件。
• 不對空數組進行檢測，不改變原數組

let arr = [Array(), [], {}, null]
let res1 = arr.some((item, index, arr) => {
    return Object.prototype.toString.call(item) === '[object Array]'
})
let res2 = arr.every((item, index, arr) => {
    return Object.prototype.toString.call(item) === '[object Array]'
})
console.log(res1,res2); // true false

map 和 forEach

• map() 對數組中的每個元素進行處理，得到新的數組，不改變原數組
• forEach() 相當於 for 循環，返回 undefined，不改變原數組

let res = [0,1,2,3,4].map((item, idx)=> item * idx); // [ 0, 1, 4, 9, 16 ]

reduce

• reduce((accumulator, currentValue, currentIndex, array)=>{}, initValue)
• 第一個參數是迭代器函數，函數的作用是對數組中從左到右的每一個元素進行處理。第二個可選參數是累加器的初始值。沒有時，累加器第一次的值爲currentValue。
• accumulator 累加器，即函數上一次調用的返回值。第一次的時候爲 initialValue || arr[0]
• currentValue 數組中函數正在處理的的值，第一次的時候是 initialValue || arr[1]
• currentIndex 數組中函數正在處理的的索引
• array 函數調用的數組

console.log(
    [1,2,3].reduce((a,b,c,d)=>{
        console.log(a,b,c,d);
        return a+b; // 下一次的a
    }, 4)
); // 10
/* 
    4 1 0 [ 1, 2, 3 ]
    5 2 1 [ 1, 2, 3 ]
    7 3 2 [ 1, 2, 3 ] 
*/

當然累乘或者做其他業務也是可以的。