Javascript數組常見的方法

第一類：原型方法：

棧方法（後進先出）

push

做用：將任意數量的參數逐個添加到數組尾部
影響：破壞了原數組
參數：任意個
返回值： 新數組的長度

pop

做用：刪除數組最後一項
影響：破壞了原數組
參數：無
返回值：刪除的項，空數組返回undefined

隊列方法（先進先出）

unshift

做用：將任意個參數逐個添加到數組前端
影響：破壞了原數組
參數：任意個
返回值：新數組的長度

shift

做用：刪除數組第一項
影響：破壞了原數組
參數：無
返回值：刪除的項，空數組返回undefined

重排序方法

reverse

參數：無
做用：反轉數組
返回值：排序後的數組
影響：破壞了原數組

sort

1）不推薦使用默認排序方法
2）接受一個比較函數做爲參數，
3）比較函數接受兩個參數，若是第一個參數位於第二個參數以前則返回一個負數，如兩個參數相等則返回0，若第一個參數位於第二個參數以後則返回一個正數
4）比較數值數組的比較函數

function ascendingCompare(num1, num2) {
    return num1 - num2;
}

function descendingCompare(num1, num2) {
    return num2 - num1;
}
   

var arr = [1 , 2, 3];
console.log(arr.sort(ascendingCompare) // [1,2,3]
console.log(arr.sort(descendingCompare) // [3,2,1]

5）根據對象數組裏的對象的某個指定屬性的比較函數（閉包）

function compare(propertyName) {
    return function (object1, object2) {
        return object1[propertyName] - object2[propertyName]
    }
}

var arr [{name: '子虛', age: 12}, {name: '烏有', age: 13}]
console.log(arr.sort(compare(age)) // {name: '子虛', age: 12}, {name: '烏有', age: 13}]

6）返回值：排序後的數組
7）影響：破壞了原數組

操做方法

concat

1）先建立當前數組的一個副本，而後將接收到的參數添加到這個副本的尾部，最後返回這個副本
2）若是參數是一個或多個數組，這該方法會將這些數組中的每一項都添加到結果數組中
3）若是參數不是數組，這些值會被簡單的添加到結果數組的末尾
4）若是不傳參數，它只是複製數組並返回副本（可用於複製數組）
5）不會破壞原數組

join

1） 將數組中的全部元素拼接成一個字符串並返回
2）能夠在join傳遞一個字符串做爲參數，該參數表示鏈接的方式
3）不會破壞原數組
String.prototype.split是Array.prototype.join的反方法

slice

1）從當前數組中取出一個或多個指定的連續的元素建立數組並返回
2）當只有一個參數時，該方法從該參數位置開始到當前數組的全部項
3）當有兩個參數時，該方法返回起始和結束位置之間的項，但不包括結束位置的項
4）當參數中有負數的時候，用數組長度加上該數來肯定相應的位置
5）不會破壞原數組

splice

1）刪除數組中的指定的連續的元素，也可向數組的中部插入項
2）刪除：提供兩個參數：刪除第一項的起始位置，刪除的個數
3）插入：提供三個參數：起始位置，0（刪除的項數），要插入的項
4）編輯：提供三個參數：起始位置，刪除的項數，要添加的項（刪除的項數不必定要等於添加的項數）
5）返回從原始數組刪除的項組成的數組
6）破壞了原數組

如下爲es5新增

位置方法

indexOf/lastIndexOf

1）這兩個方法都接受兩個參數：要查找的項和（可選的）起始位置，
2）indexOf從數組開頭向後查找，lastIndexOf從數組末尾向前查找
3）返回查找的項在數組中的位置，或者在沒找到的狀況下返回-1
4）使用全等操做符 （NaN不等於NaN）

遍歷

forEach

1）對數組每一項運行遍歷函數做爲第一個參數，第二個參數是綁定遍歷函數的this
2）該函數分別接受三個參數：數組元素，數組索引（可選），數組自己（可選）
3）無返回值
4）缺點：沒法像for循環那樣用break語句提早終止遍歷

映射

map

1）對數組每一項運行遍歷函數做爲第一個參數，第二個參數是綁定遍歷函數的this
2）返回每次遍歷函數調用的結果組成的數組
3）該遍歷函數分別接受三個參數：數組元素，數組索引（可選），數組自己（可選）

過濾

filter

1）對數組每一項運行遍歷函數做爲第一個參數，第二個參數是綁定遍歷函數的this
2）返回該函數會返回true的項組成的數組
3）該遍歷函數分別接受三個參數：數組元素，數組索引（可選），數組自己（可選）

檢測

every/some

1）它們對數組元素應用指定的函數進行斷定，返回true或false
2）every就像數學中的「針對全部」的量詞∀，當前僅當數組中的每一項調用指定函數都返回true，它才返回true
3）some就像數學中的「存在」的量詞ョ，只要數組中有一項調用指定函數返回true，它就返回true
4）一旦every和some確認返回值就會中止遍歷
5）根據數學上的慣例，空數組調用every返回true，some返回false

概括

reduce/reduceRight

1）使用指定的函數對數組元素進行組合，生成單個值，這在函數式編程中是常見操做，也可成爲「注入」和「摺疊」
2）reduce第一個參數是執行簡化操做的化簡函數，化簡函數的任務是用某種方法把兩個值組合或化簡爲一個值，並返回化簡後的值，第二個參數（可選）是做爲化簡函數的第一個參數的初始值，若是不傳就取數組的第一項
3）化簡函數的第一個參數是到目前爲止的化簡操做累計的結果，第2-4個參數分別是數組元素、數組索引和數組自己
4）reduceRight相似於reduce，不一樣的是它是從右往左處理

const a = [1,2,3,4,5]
const sum = a.reduce(function(x,y){return x+y}, 0) // 數組求和
const max = a.reduce(function(x,y){return (x>y)?x:y}) // 數組求最大值

如下爲es6新增

copyWithin

1）做用：在當前數組內部，將指定位置的成員複製到其餘位置
2）參數：cpyWithin(pasteStart, copyStart, copyEnd)
pasteStart：從該位置開始替換元素, 若是爲負值，表示從末尾開始計算；
copyStart：從該位置開始讀取數據，默認爲 0,若是爲負值，表示從末尾開始計算；
copyEnd：到該位置前中止讀取數據，不包括該位置，默認值爲數組的長度,若是爲負值，表示從末尾開始計算
3）返回值：當前數組
4）破壞了原數組

find/findIndex

1)find方法，用於找出第一個符合條件的數組成員。它的參數是一個回調函數(參數依次爲當前的值、當前的位置和原數組)，全部數組成員依次執行該回調函數，直到找出第一個返回值爲true的成員，而後返回該成員。若是沒有符合條件的成員，則返回undefined
2)findIndex方法的用法與find方法很是相似，返回第一個符合條件的數組成員的位置，若是全部成員都不符合條件，則返回-1
3）這兩個方法均可以接受第二個參數，用來綁定回調函數的this對象
4）這兩個方法均可以發現NaN，彌補了數組的indexOf方法的不足

[NaN].indexOf(NaN) // -1
[NaN].findIndex(y => Object.is(NaN, y)) // 0

fill

1）參數：參數1用來填充數組的元素，參數2填充數組的起始位置（可選），參數3填充數組的結束位置（可選，不包括結束位置）

['a', 'b', 'c'].fill(7, 1) // ['a', 7, 7]

2）返回值：新數組
3）破壞了原數組
4）若是填充的類型爲對象，那麼被賦值的是同一個內存地址的對象，而不是深拷貝對象

let arr = new Array(3).fill({name: "Mike"});
// [{name: "Mike"}, {name: "Mike"}, {name: "Mike"}]
arr[0].name = "Ben";
// [{name: "Ben"}, {name: "Ben"}, {name: "Ben"}]

keys/values/entries

ES6 提供三個新的方法——entries()，keys()和values()——用於遍歷數組。它們都返回一個遍歷器對象，能夠用for...of循環進行遍歷。惟一的區別是keys()是對鍵名的遍歷、values()是對鍵值的遍歷，entries()是對鍵值對的遍歷。

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1

for (let elem of ['a', 'b'].values()) {
  console.log(elem);
}
// 'a'
// 'b'

for (let [index, elem] of ['a', 'b'].entries()) {
  console.log(index, elem);
}
// 0 "a"
// 1 "b"

若是不使用for...of循環，能夠手動調用遍歷器對象的next方法，進行遍歷。

let letter = ['a', 'b', 'c'];
let entries = letter.entries();
console.log(entries.next().value); // [0, 'a']
console.log(entries.next().value); // [1, 'b']
console.log(entries.next().value); // [2, 'c']

includes

1)參數：要檢測的元素
2）做用：檢測某個數組是否包含給定的元素
3）返回值：布爾值
4）使用不同的判斷算法

[NaN].includes(NaN) // true

flat/flatMap

flat
1)用於將嵌套的數組「拉平」，變成一維的數組。
2)參數是想要拉平的層數，默認值爲1，若是無論有多少層嵌套，都要轉成一維數組，能夠用Infinity關鍵字做爲參數。
3)該方法返回一個新數組.
4)對原數組沒有影響。

[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]

[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]

[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]

[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]

flatMap
1)對原數組的每一個成員執行一個遍歷函數（至關於執行Array.prototype.map()），而後對返回值組成的數組執行flat()方法。
2)只能拉平一層。
3）第一個參數是一個遍歷函數，這個遍歷函數有三個參數，分別是當前數組的成員，當前索引，和當前數組，第二個參數是綁定遍歷函數的this。
4）返回一個新數組。
5）不改變原數組。

// 至關於 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]

//只能拉平一層 至關於 [[[2]], [[4]], [[6]], [[8]]].flat()
[1, 2, 3, 4].flatMap(x => [[x * 2]])
// [[2], [4], [6], [8]]

第二類：靜態方法：

Array.of()
1)誕生緣由：Array()構造器有一個總所周知的陷阱，就是隻傳一個參數，且這個參數是數字的話，那麼不會構造出一個值爲這個數字的單元素的數組，而是一個空數組，其length屬性爲這個數字；
2）Array.of老是返回參數值組成的數組。若是沒有參數，就返回一個空數組。

Array.from()
1）用於將兩類對象轉爲真正的數組：相似數組的對象（arguments, nodelist）和可遍歷（iterable）的對象（Set ,Map, 字符串）

var arrLike = {
    length: 4,
    2: "foo",
}
Array.from(arrLike) // [undefined, undefined, "foo", undefined]

2）第一個參數是要轉換的數據，第二個是可選參數，是一個映射回調函數，做用相似於數組的map方法，用來對每一個元素進行處理，將處理後的值放入返回的數組，還能夠傳第三個可選參數，用於指定第二個參數回調函數的this

var arrLike = {
    length: 4,
    2: "foo",
}
Array.from(arrLike, item => item || 0)  // [0, 0 , "foo", 0]

參考資料：《黃皮書》《紅皮書第三版》《犀牛書》《阮大神es6》