Array -- 自帶方法 · 前端知識 -- 學習整理

[更多方法參考](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array) [TOC] >[success] # 內置對象Array ~~~ * Array.isArray(對象)---->判斷這個對象是不是數組 * instanceof關鍵字 * .concat(數組,數組,數組,...) 組合一個新的數組 * .every(函數)--返回值是布爾類型,函數作為參數使用,函數中有三個參數,第一個參數是元素的值，第二個參數是索引值,第三個參數是原來的數組(沒用) * 如果這個數組中的每個元素的值都符合條件,最后才返回的是true * * .filter(函數);返回的是數組中每一個元素都復合條件的元素,組成了一個新的數組 * * .push(值);--->把值追加到數組中,加到最后了---返回值也是追加數據之后的數組長度 * .pop();--->刪除數組中最后一個元素,返回值就是刪除的這個值 * .shift();--->刪除數組中第一個元素,返回值就是刪除的這個值 * .unshift();--->向數組的第一個元素前面插入一個新的元素,----返回值是插入后的程度 * .forEach(函數)方法---遍歷數組用---相當于for循環 * .indexOf(元素值);返回的是索引,沒有則是-1 * .join("字符串");----返回的是一個字符串 * .map(函數);--->數組中的每個元素都要執行這個函數,把執行后的結果重新的全部的放在一個新的數組中 * .reverse();----->反轉數組 * .sort();---排序的,可能不穩定,如果不穩定,請寫MDN中的那個固定的代碼 * .arr.slice(開始的索引,結束的索引);把截取的數組的值放在一個新的數組中,但是不包含結束的索引對應的元素值 * .splice(開始的位置,要刪除的個數,替換的元素的值);一般是用于刪除數組中的元素,或者是替換元素,或者是插入元素 ~~~ >[danger] ##### 判斷是不是數組 ~~~ var a = [1,2,3,4,5]; console.log(Array.isArray(a)); console.log( a instanceof Array ); 打印結果： true true ~~~ >[danger] ##### 數組的拼接--concat ~~~ var a = [1,2,3]; var b = [4,5,6]; var c = a.concat(b); console.log(c) 打印結果： [1, 2, 3, 4, 5, 6] ~~~ >[danger] ##### 數組的淺拷貝--from ~~~ var arr=["a","b","c"]; var newArr=Array.from(arr); ~~~ >[danger] ##### 循環數組操作return bool 類型---every ~~~ 1.回調函數中第一個參數元素的值，二個索引，第三個是原數組（實際用不上） 2.每一個元素都符合，函數內的判斷，返回的是bool 類型 ~~~ ~~~ // 判斷數組中每一個元素值是不是大于200 var a = [100,200,300]; // 回調函數 var flag = a.every(function (a, b) { return a>200 }); console.log(flag) 打印結果： false ~~~ >[danger] ##### 過濾出符合判斷的新數組--fittler ~~~ // 過濾生成新元素,返回所有奇數 var a = [1,2,3,4,5,6]; var newA = a.filter(function (ele) { return ele%2 }) console.log(newA) 打印結果： [1,3,5] ~~~ >[danger] ##### 數組的基本操作-- 增刪 ~~~ 1 .push(值);--->把值追加到數組中,加到最后了---返回值也是追加數據之后的數組長度 2 .pop();--->刪除數組中最后一個元素,返回值就是刪除的這個值 3 .shift();--->刪除數組中第一個元素,返回值就是刪除的這個值 4 .unshift();--->向數組的第一個元素前面插入一個新的元素,----返回值是插入后的程度 ~~~ ~~~ var a = [1,2,3,4,5,6]; a.push("a"); console.log(a) var a = [1,2,3,4,5,6]; a.pop(); console.log(a) var a = [1,2,3,4,5,6]; a.shift(); console.log(a) var a = [1,2,3,4,5,6]; a.unshift(1); console.log(a) 打印結果： [1, 2, 3, 4, 5, 6, "a"] [1, 2, 3, 4, 5] [2, 3, 4, 5, 6] [1, 1, 2, 3, 4, 5, 6] ~~~ >[danger] ##### 循環數組中所有元素--forEach() ~~~ 1.第一個參數元素，二個是位置 ~~~ ~~~ var a = [1,2,3,4,5,6] a.forEach(function (ele, index) { console.log(ele, index) }) 打印結果： 1 0 2 1 3 2 4 3 5 4 6 5 ~~~ >[danger] ##### 根據元素返回索引--indexOf() ~~~ 1.存在則返回對應位置，不存在返回-1 ~~~ ~~~ var a = [1,2,3,4,5,6]; console.log(a.indexOf(4)) 打印結果： 3 ~~~ >[danger] ##### 將數組拼接成字符串--join ~~~ var a= [1,2,3,4]; console.log(a.join("|")) 打印結果： 1|2|3|4 ~~~ >[danger] ##### 執行每一個元素返回數組--map ~~~ 1.參數是每一個元素 ~~~ ~~~ var a= [1,2,3,4]; a = a.map(function (value) { return value+1 }) console.log(a) 打印結果： [2,3,4,5] ~~~ >[danger] ##### 反轉數組--reverse() ~~~ var a= [1,2,3,4]; console.log(a.reverse()) 打印結果： [4,3,2,1] ~~~ >[danger] ##### 對數組做切片-- slice ~~~ 1.顧頭不顧腚 ~~~ ~~~ var a= [1,2,3,4]; console.log(a.slice(0,2)) 打印結果： [1,2] ~~~ >[danger] ##### 從指定位置刪除元素-- splice(刪除、插入、替換) ~~~ 1.第一個參數，起始位置 2.第二個參數，刪除的個數 3.第三個參數，要替換的元素 4.返回值是刪除元素的列表 ~~~ ~~~ var a= [1,2,3,4]; a.splice(0,2) console.log(a) var a= [1,2,3,4]; a.splice(0,2,66) console.log(a) 打印結果： [3,4] [66,3,4] ~~~ >[danger] ##### 數組的排序--sort ~~~ 1.sort()是根據字符編碼的順序進行排序，所以對數字類型排序需要自定義 2. 如果 compareFunction(a, b) 小于 0 ，那么 a 會被排列到 b 之前；如果 compareFunction(a, b) 等于 0 ， a 和 b 的相對位置不變。備注： ECMAScript 標準并不保證這一行為，而且也不是所有瀏覽器都會遵守（例如 Mozilla 在 2003 年之前的版本）；如果 compareFunction(a, b) 大于 0 ， b 會被排列到 a 之前。 compareFunction(a, b) 必須總是對相同的輸入返回相同的比較結果，否則排序的結果將是不確定的。 ~~~ ~~~ var a= [1,2,18,4,1,22]; console.log(a.sort()) 打印結果： [1, 1, 18, 2, 22, 4] var a= [1,2,18,4,1,22]; console.log(a.sort(function (a1,a2) { if(a1>a2){ return 1; }else if (a1<a2){ return -1 } else { return 0 } })) 打印結果： [1, 1, 2, 4, 18, 22] ~~~ >[danger] ##### findIndex 查詢返位置角標 ~~~ var array = ['wang','wang2'] const newArrayIndex = array.findIndex(item=>item === 'wang') console.log(newArrayIndex) // 0 ~~~ >[danger] ##### find 返回內容 ~~~ var array = ['wang','wang2'] const newArray = array.find(item=>item === 'wang') console.log(newArray) // wang ~~~ >[danger] ##### Reduce 很強大參看文章開頭的推薦文章