js 數組方法總結

Array數組：

length屬性

    可經過array.length增長或者減小數組的長度，如;array.length=4(數組長3，第四位爲undefined),也可單純得到長度。array[array.length]=’’賦值。

檢測數組

檢測是否數組ES3  instanceof array  ES5新增的Array.isArray(),支持的IE9+,Opera 10.5+,Chrome，Safari5+。

 

一：原數組不變  [,start],表示0或1個參數

concat()

無參，返回數組副本;參數爲數組，將兩個數組鏈接;不是數組，添加到結果數組末尾。在concat拷貝原數組的過程當中，對象引用時會複製對象引用到組合的新數組中，原數組和新數組中的對象引用都指向同一個實際變量。因此，實際對象被修改時，兩數組同時被修改。

粒：

                            

 

includes()

ES7。返回一個布爾值，表示數組中是否包含給定的值，與字符串includes方法相似。

Includes(searchElement,fromIndex),fromIndex可選，表示開始位置，若是爲負值，按升序從array.length+fromIndex索引開始搜索。

Includes（）做爲一個通用方法，也能夠用於其餘類型對象，栗子：

(function() {

  console.log([].includes.call(arguments, 'a')); // true

  console.log([].includes.call(arguments, 'd')); // false

})('a','b','c');

兼容性（IE未實現）

 

join()

只接受一個參數，分隔符的字符串，而後返回全部項的字符串，array.join(「||」)//1||2||3

若是參數爲空，將數組中的元素直接拼接。Undefied or null 轉化爲空字符串

slice()

將數組的一部分淺複製（shallow copy）存入新的數組並返回，不改變原數組。

1參或兩參；1個參返回的是從該參數指定位置到數組末尾項；2個參返回起始和結束位置之間項，不包括結束位置項。

 

indexOf(searchElement,fromIndex)

要查找的項，（可選）表示查找起點位置的索引。沒有找到返回-1，從頭開始查找；第二參數表示開始查找的位置，返回的結果依然是數組中的排位。故做用不大。

 

lastIndexOf()從尾開始查找；

toString()返回由數組中每一個值得字符串形式拼接而成的一個逗號分隔的字符串，

valueOf()返回的仍是數組。

toLocaleString()和前二者差很少。

   

2、改變自身方法

arr.copyWithin(target，[, start[, end]])     兼容問題

數組內部替換操做，負數，倒數開始

[1, 2, 3, 4, 5].copyWithin(-2);  

// [1, 2, 3, 1, 2] 

 

[1, 2, 3, 4, 5].copyWithin(0, 3);  

// [4, 5, 3, 4, 5]  

  

[1, 2, 3, 4, 5].copyWithin(0, 3, 4);  

// [4, 2, 3, 4, 5]  

  

[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);  

// [1, 2, 3, 3, 4] 

 

array.fill(value [,statrt [, end ]])

將指定區間元素填充

[1, 2, 3].fill(4);               // [4, 4, 4]

[1, 2, 3].fill(4, 1);            // [1, 4, 4]

[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]

[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]

[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]

[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]

Array(3).fill(4);                // [4, 4, 4]

[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}

 pop()

從數組末尾移除最後一項，減小數組的length值，返回移除的項。

push()

能夠接受任意數量的參數，把它們逐個添加到數組的末尾，並返回修改後數組的長度

reverse()

反轉數組項的順序

shift()

移除數組中的第一項並返回第一項，數組長度減1

unshift()

在數組前端添加任意個項，並返回新數組的長度

 

sort()

默認是按升序排列數組，比較的是字符串。要想按本身想法排序,寫方法。Sort(方法名) a>b return 1,反之-1，相等 return 0

 

 splice()最強大的數組方法。向數組的中部插入項。

    1：刪除，2個參數，要刪除的第一項位置和項數，splice(0,2)刪除數組中的前兩項。

    2：插入，3個參數，起始位置、要刪除的項數、要插入的項數，若是是多項，繼續傳入參數，第4,5更多。Splice(2,0,’1’,’2’),當前數組位置2插入字符串1,2；

3：替換，能夠向指定位置插入任意數量的項，同時刪除任意數量的項。用法同第二條，第二個參數不是0。

栗子：

刪除給定數組中的第二項和第三項，而且在獲得的新的數組中第一項後面添加一個新的值

var arr1 = ['a','b','c','d','e'];

var arr2 = arr1. splice ( 1 , 2 ,'newvalue');

 

 

 3、遍歷方法

forEach((v, i, a) => {})
讓數組的每一項都執行一次給定的函數
v表示當前項的值，i表示當前索引，a表示數組自己
forEach遍歷的範圍在第一次調用 callback前就會肯定。調用forEach後添加到數組中的項不會被 callback訪問到。若是已經存在的值被改變，則傳遞給 callback的值是 forEach遍歷到他們那一刻的值。已刪除的項不會被遍歷到。

 

entries();

返回一個array

栗子：

var arr = ["a", "b", "c"];

var eArr = arr.entries();

console.log(eArr.next().value); // [0, "a"]

console.log(eArr.next().value); // [1, "b"]

console.log(eArr.next().value); // [2, "c"]

 

every(),對數組中的每一項運行給定函數，若是該函數對每一項返回true,則返回true

some()是對數組中每一項運行指定函數，若是該函數對任一項返回true，則返回true

   

 filter()

使用指定的函數測試全部元素，並建立一個包含全部測試經過的元素的新數組
callback函數返回一個布爾值，true即經過測試
不會改變原數組

栗子1

function traverse(){//輸出全部頁面寬度和高度大於50像素的節點

    return Array.prototype.filter.call(document.querySelectorAll('body *'), function(node){

        return node.offsetWidth > 50 && node.offsetHeight > 50;

    });

}

栗子2

var a1 = ['a', 10, 'b', 20, 'c', 30];var a2 = a1.filter(function(item) {

    return typeof item == 'number';

});console.log(a2); // logs 10,20,30

 

find()

查詢到第一個符合條件的就返回             IE不支持

 

   

keys()                                    IE不支持

返回一組數組索引的迭代器（相似於entries）

var arr = ['a', , 'c'];

var sparseKeys = Object.keys(arr);

var denseKeys = [...arr.keys()];

console.log(sparseKeys); // ['0', '2']

console.log(denseKeys);  // [0, 1, 2]

 

array.map((v, i, a) => {})                       IE9+
返回一個由原數組中的每一個元素調用一個指定方法後的返回值組成的新數組
map 不修改調用它的原數組自己（固然能夠在 callback 執行時改變原數組）

var numbers = [1, 4, 9];

var roots = numbers.map(Math.sqrt);

// roots is now [1, 2, 3]

// numbers is still [1, 4, 9]

 

 

    

例var number = [1,2,3,4,5,4,3,2,1];

   Var everyResult = number.every(function(item,index,array){

//函數

})

Alert(everyResult);

 

reduce()，reduceRight() (反方向)                    IE9+

對數組中的全部元素調用指定的回調函數。該回調函數的返回值爲累積結果，而且此返回值在下一次調用該回調函數時做爲參數提供。

從第一項開始，接收四個參數：例

Var values = [1,2,3,4,5];

Var sum = values.reduce(function(prev, cur, index, array){

Return prev + cur;

});

 

var flattened = [[0, 1], [2, 3], [4, 5]].reduce(

  function(a, b) {

    return a.concat(b);

  },

  []);// flattened is [0, 1, 2, 3, 4, 5]

 

 

Array.prototype.slice.call

真實數組具備slice方法，能夠對數組進行淺複製（不影響原數組），返回的依然是數組。相似數組雖然有length屬性，能夠使用for循環遍歷，卻不能直接使用slice方法，會報錯！可是經過Array.prototype.slice.call則不會報錯，自己（相似數組）被從頭至尾slice複製了一遍——變成了真實數組！

將相似數組的對象(好比arguments)轉換爲真實的數組

 

Array.prototype.slice.call(arguments)