- splice方法
/* 方法:splice(start,deleteCount,item1,item2...)
* 功能：可實(shí)現(xiàn)數(shù)組項(xiàng)的刪除、插入、替換
* 返回值：由被刪除的元素組成的一個(gè)數(shù)組，如果沒(méi)有被刪除則返回空數(shù)組
* 參數(shù)：start:刪除或插入或替換的起始位置
* deleteCount（可選）:刪除或插入或替換的數(shù)量。若忽略，
* 則從start開(kāi)始后邊都會(huì)被刪除
* item1（可選）:刪除或插入或替換的值
*/
let arr = [1,2,3,4,5]
let ary = arr.splice(1,2) // 從數(shù)組下標(biāo)1開(kāi)始刪除2個(gè)元素
console.log(arr,ary) //arr:[1,4,5] ary:[2,3]
ary = arr.splice(1,2,2,3)// 從數(shù)組下標(biāo)1開(kāi)始替換2個(gè)元素為2，3
console.log(arr,ary) //arr:[1,2,3] ary:[4,5]
ary = arr.splice(3,0,4,5)// 從數(shù)組下標(biāo)3開(kāi)始增加2個(gè)元素4，5
console.log(arr,ary) //arr:[1,2,3,4,5] ary:[]
- slice方法
/* 方法:slice(start,end)
* 功能：淺拷貝數(shù)組中的某段數(shù)據(jù)(淺拷貝說(shuō)明如果是引用類(lèi)型數(shù)據(jù)則拷貝的是引用地址)
* 返回值：返回一個(gè)淺拷貝了某段數(shù)據(jù)的新數(shù)組
* 參數(shù)：start(可選):起始位，對(duì)應(yīng)數(shù)組下標(biāo)（包含該位）
* end(可選):結(jié)束位，數(shù)組下標(biāo)（不包含該位）
*/
let arr = [1,2,3,4,{name:'good'}]
let ary = arr.slice(1,2) // 從數(shù)組下標(biāo)1淺拷貝到數(shù)組下標(biāo)2前
console.log(arr,ary) //arr:[1,2,3,4,{name:'good'}] ary:[2]
ary = arr.slice()// 淺拷貝整個(gè)數(shù)組
console.log(arr,ary) //arr:[1,2,3,4,{name:'good'}] ary:[1,2,3,4,{name:'good'}]
ary = arr.slice(3)// 從數(shù)組下標(biāo)3開(kāi)始淺拷貝
console.log(arr,ary) //arr:[1,2,3,4,{name:'good'}] ary:[4,{name:'good'}]
ary[0] = 100
ary[1].name = 'bad'
console.log(arr,ary) //arr:[1,2,3,4,{name:'bad'}] ary:[100,{name:'bad'}]
- join方法
/* 方法:join(separator)
* 功能：用分隔符將數(shù)組中的每一項(xiàng)連接起來(lái)形成字符串
* 返回值：返回一個(gè)用分隔符連接起來(lái)的字符串
* 參數(shù)：separator(可選):分隔符（為空時(shí)，默認(rèn)為’，‘）
*/
let arr = [1,2,3,4]
let ary = arr.join() // 用默認(rèn)逗號(hào)分隔符將數(shù)組中的每一項(xiàng)連接起來(lái)形成字符串
console.log(arr,ary) //arr:[1,2,3,4] ary:"1,2,3,4"
ary = arr.join("")// 將數(shù)組中的每一項(xiàng)連接起來(lái)形成字符串
console.log(arr,ary) //arr:[1,2,3,4] ary:“1234”
ary = arr.join('good')// 用'good'將數(shù)組中的每一項(xiàng)連接起來(lái)形成字符串
console.log(arr,ary) //arr:[1,2,3,4] ary:"1good2good3good4"
arr = [1,2,3,undefined,4,null]
ary = arr.join() // 如果數(shù)組元素為undefined或null，都返回空
console.log(arr,ary) //arr:[1,2,3,undefined,4,null] ary:"1,2,3,,4,"
ary = arr.join("") // 如果數(shù)組元素為undefined或null，都返回空
console.log(arr,ary) //arr:[1,2,3,undefined,4,null] ary:"1234"
- concat方法
/* 方法:concat(val1,val2....)
* 功能：合并一個(gè)或多個(gè)數(shù)組，返回新的數(shù)組，原數(shù)組不會(huì)被改變。數(shù)組元素若是引用類(lèi)型，也為淺拷貝
* 返回值：返回一個(gè)新的數(shù)組（淺拷貝）
* 參數(shù)：val(可選):數(shù)組
*/
let arr1 = [1,2,3]
let arr2 = [4,5,6,{name:'good'}]
let ary = arr1.concat(arr2) // 連接兩個(gè)數(shù)組
console.log(arr1,ary) //arr1:[1,2,3] ary:[1,2,3,4,5,6,{name:'good'}]
ary = arr1.concat(arr2)
ary[6].name = 'bad'
console.log(arr2,ary) //arr2: [4,5,6,{name:'bad'}] ary:[1,2,3,4,5,6,{name:'bad'}]
ary = arr1.concat()
console.log(arr1,ary) //arr1:[1,2,3] ary:[1,2,3]
- filter方法
/* 方法:filter(callback(item,index,array))
* 功能：創(chuàng)建一個(gè)新數(shù)組，其包含滿(mǎn)足所提供方法的元素
* 返回值：返回一個(gè)新的數(shù)組,滿(mǎn)足提供的方法的元素
* 參數(shù)：callback:用來(lái)測(cè)試數(shù)組的每個(gè)元素的函數(shù)。返回 true 表示該元素通過(guò)測(cè)試，保留該元素，false 則不保留。
*/
let arr = [1,2,3]
let ary = arr.filter(item=>(){
return item>1
}) // 過(guò)濾大于1的元素
console.log(arr,ary) //arr1:[1,2,3] ary:[2,3]
arr = [1,2,3,[3,4]]
ary = arr.filter(item=>{
return item>1
}) // 過(guò)濾大于1的元素
console.log(arr,ary) //arr: [1,2,3,[3,4]] ary: [2,3]
- some方法
/* 方法:some(callback(item,index,array))
* 功能：測(cè)試數(shù)組是否至少滿(mǎn)足一次所提供的函數(shù)
* 返回值：Boolean =>至少滿(mǎn)足一次則為true,反之為false
* 參數(shù)：callback:用來(lái)測(cè)試數(shù)組的每個(gè)元素的函數(shù)。
*/
let arr = [1,2,3]
let flag = arr.some(item=>{
return item==2
}) // 是否存在’2‘這個(gè)元素
console.log(arr,flag) //arr:[1,2,3] flag:true
- map方法
/* 方法:map(callback(item,index,array))
* 功能：用提供的方法遍歷一遍數(shù)組，形成新數(shù)組
* 返回值：數(shù)組
* 參數(shù)：callback:遍歷每個(gè)元素的方法
*/
let arr = [1,2,3]
let ary = arr.map(item=>{
return item*2
}) // 給數(shù)組每位元素都乘以2
console.log(arr,ary) //arr:[1,2,3] ary:[2,4,6]
- sort方法
/* 方法:sort(compareFunc(firstEl,secondEl))
* 功能：對(duì)數(shù)組進(jìn)行排序并返回
* 返回值：排序后的數(shù)組，原地排序
* 參數(shù)（可選）：compareFunc(firstEl,secondEl)
* firstEl: 數(shù)組的第二項(xiàng)a[1]
* secondEl: 數(shù)組的第一項(xiàng)a[0]
* 如果compareFunc>0,那么firstEl排在secondEl之后
* 如果compareFunc=0,那么firstEl和secondEl的相對(duì)位置不變
* 如果compareFunc<0,那么firstEl排在secondEl之前
*/
let arr = [1,2,3]
arr.sort((firstEl,secondEl)=>{
return secondEl - firstEl
}) // 實(shí)現(xiàn)數(shù)組從大到小排序
console.log(arr) // arr:[3,2,1]
arr = [1,2,3,34,31,4]
arr.sort()
console.log(arr) // arr:[1,2,3,31,34,4]
- indexOf方法
/* 方法:indexOf(searchEl,fromIndex)
* 功能：尋找索引
* 返回值：在數(shù)組中的索引位置
* 參數(shù)：
* searchEl: 查找的元素值
* fromIndex(可選): 開(kāi)始查找的索引值
*/
let arr = [1,2,3]
let index = arr.indexOf(2) // 查找元素’2‘的索引值
console.log(index) // index:1
arr = [1,2,3,34,31,4]
index = arr.indexOf(31,3)// 從索引值3開(kāi)始尋找元素31
console.log(index) // index:4
- find方法
/* 方法:find(callback(item,index,array))
* 功能：找到第一個(gè)符合所提供的函數(shù)的條件，并返回該元素
* 返回值：符合條件的元素
* 參數(shù)：
* item: 當(dāng)前遍歷到的元素
* index(可選): 當(dāng)前遍歷到的索引
* array(可選): 數(shù)組本身
*/
let arr = [1,2,3,4]
let element = arr.find(item=>{return item>2}) // 查找第一個(gè)大于2的元素
console.log(element) // element:3
// 需要注意它與filter的區(qū)別：find是找到第一個(gè)滿(mǎn)足函數(shù)的元素，而filter是所有滿(mǎn)足函數(shù)的元素
- forEach方法
/* 方法:forEach(callback(item,index,array))
* 功能：使用函數(shù)遍歷數(shù)組所有元素
* 返回值：undefined
* 參數(shù)：
* item: 當(dāng)前遍歷到的元素
* index(可選): 當(dāng)前遍歷到的索引
* array(可選): 數(shù)組本身
*/
let arr = [1,2,3,4]
arr.forEach((item,index)=>{arr[index]+=item}) // 查找第一個(gè)大于2的元素
console.log(arr) // arr:[2,4,6,8]
// 需要注意它與map的區(qū)別：map是返回新數(shù)組，而forEach返回值是undefined
- reduce方法
/* 方法:reduce(callback(accumulator, currentValue,index,array),initialValue)
* 功能：所有數(shù)組元素執(zhí)行一次callback函數(shù),將其結(jié)果匯總成單個(gè)結(jié)果返回
* 返回值：函數(shù)累計(jì)的結(jié)果（也就是accumulator的值）
* 參數(shù)：
* accumulator: 累計(jì)值
* currentValue: 當(dāng)前遍歷到元素
* index(可選): 當(dāng)前遍歷到的索引
* array(可選): 數(shù)組本身
* initialValue(可選): accumulator的初始值。若沒(méi)有，則為數(shù)組中第一個(gè)元素
*/
// e.g.1:計(jì)算各元素重復(fù)出現(xiàn)次數(shù)
let arr = [1,2,2,3,3,3,5,4]
let count = arr.reduce((accumulator,currentVal)=>{
if(currentVal in accumulator){
accumulator[currentVal]++
}else{
accumulator[currentVal] = 1
}
return accumulator
},{})
console.log(arr) // count:{1: 1, 2: 2, 3: 3, 4: 1, 5: 1}
// e.g.2:按照屬性進(jìn)行統(tǒng)計(jì)
let people = [
{ name: 'Alice', age: 21 },
{ name: 'Max', age: 20 },
{ name: 'Jane', age: 20 }
]
function groupBy(property,objArray){
return objArray.reduce((accu,val)=>{
if(val[property] in accu){
accu[val[property]].push(val)
}else{
accu[val[property]] = Array.of(val)
}
return accu
},{})
}
let groupByAge = groupBy('age',people)
// 輸出如下：
// {
// 20: [
// { name: 'Max', age: 20 },
// { name: 'Jane', age: 20 }
// ],
// 21: [{ name: 'Alice', age: 21 }]
// }
// e.g.3:實(shí)現(xiàn)數(shù)組去重
let myArray = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd']
let myOrderedArray = myArray.reduce((acc,val)=>{
if(!acc.includes(val)){
acc.push(val)
}
return acc
},[])
console.log(myOrderedArray) // ["a", "b", "c", "e", "d"]
- reverse方法
/* 方法:reverse()
* 功能：反轉(zhuǎn)數(shù)組，即第一項(xiàng)變成最后一項(xiàng)，最后一項(xiàng)變?yōu)榈谝豁?xiàng)
* 返回值：經(jīng)反轉(zhuǎn)后的原數(shù)組
*/
let arr = [1,2,3,4]
let reverseArr = arr.reverse() // 反轉(zhuǎn)數(shù)組
console.log(arr,reverseArr ) // arr:[4,3,2,1] reverseArr :[4,3,2,1]
- flat方法
/* 方法:flat(depth)
* 功能：通過(guò)指定深度遍歷各元素，并且將個(gè)元素組成新數(shù)組返回
* 返回值：經(jīng)指定深度遍歷各元素后組成的新數(shù)組
* 參數(shù)：
* depth(可選)：指定要提取嵌套數(shù)組的結(jié)構(gòu)深度，默認(rèn)值為 1
*/
let arr = [1,2,3,[4,5,6]]
let flatArr= arr.flat() // 按照深度為1進(jìn)行提取元素，并組成新數(shù)組
console.log(arr,flatArr) // arr:[1,2,3,[4,5,6]] flatArr:[1,2,3,4,5,6]
// 使用 Infinity，可展開(kāi)任意深度的嵌套數(shù)組
let arr = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]
arr.flat(Infinity) // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
- fill方法
/* 方法:fill(val,start,end)
* 功能：填充數(shù)組，改變?cè)瓟?shù)組
* 返回值：填充后的數(shù)組
* 參數(shù)：
* val：要填充的值
* start(可選)：要填充的起始位置
* end(可選)：要填充的中止位置
*/
let arr = [1,2,3,4,5]
let fillArr= arr.fill(100,2,3) // 從數(shù)組下標(biāo)2開(kāi)始到數(shù)組下標(biāo)3前，填充’100‘
console.log(arr,fillArr) // arr:[1,2,100,4,5] flatArr:[1,2,100,4,5]
fillArr= arr.fill(100,2) // 從數(shù)組下標(biāo)2開(kāi)始填充’100‘
console.log(arr,fillArr) // arr:[1,2,100,100,100] flatArr:[1,2,100,100,100]
fillArr= arr.fill(100) // 從頭開(kāi)始填充’100‘
console.log(arr,fillArr) // arr:[100,100,100,100,100] flatArr:[100,100,100,100,100]
