一、map数组
1、定义:map方法对数组进行遍历,并返回一个新的数组 2、用法:
let arr = [1,2,3,4,5]
let newArr = arr.map((item,index)=>{
return item * 10
})
console.log(newArr)//[10, 20, 30, 40, 50]
3、JS模拟实现:
/**
* @function map方法模拟
* @arr 数组
* @callback 方法调用
*/
function mapSimulate(arr,callback){
let result = []
for(let i = 0;i<arr.length;i++){
result.push(callback(arr[i],i))
}
return result
}
let result = mapSimulate(arr,(item,index)=>{
return item * 10
})
console.log('结果',result)//[10, 20, 30, 40, 50]
二、filter
1、定义:filter方法对数组遍历,返回符合条件的值,组成新的数组 2、用法:取数组的偶数
let arr = [1,2,3,4,5]
let newArr = arr.filter((item)=>item%2 === 0)
console.log(newArr) //[2,4]
3、JS模拟实现
/**
* @function filter函数
* @param arr 数组
* @param callback 回调函数
*/
function filterSimulate(arr,callback){
let result = []
for(let i = 0;i<arr.length;i++){
if(callback(arr[i])){
result.push(arr[i])
}
}
return result
}
let arr = [1,2,3,4,5]
let newArr = filterSimulate(arr,(item)=>{
return item%2 === 0
})
console.log(newArr)//[2,4]
三、reduce
1、定义:遍历数组,接受一个回调函数和一个初始值,回调函数两个参数,第一个为上一次的结果,第二个参数为当前项,返回一个计算结果。 2、用法:累加获取总数
let arr = [1,2,3,4,5]
let result = arr.reduce(((res,item)=>{
return res + item
}),0)
console.log(result) //15
3、JS模拟实现
/**
* @function filter函数
* @param arr 数组
* @param callback 回调函数
* @param initialValue 初始值
*/
function reduceSimulate(arr,callback,initialValue){
let result = initialValue
for(let i=0;i<arr.length;i++){
result = callback(result,arr[i])
}
return result
}
let arr = [1,2,3,4,5]
let result = reduceSimulate(arr,((res,item)=>{
return res + item
}),0)
console.log(result)//15
四、find和findIndex
1、定义 两个有点类似,都是查找数组中符合条件的,当查找到一个符合的就返回,区别在于返回值,find返回当前项,没查找到返回undefined,findIndex返回当前下的下标值,没查找到就返回-1 2、使用
let arr = [1,2,3,4,5]
let res = arr.find(item=>item>2)
console.log(res) //3
let arr = [1,2,3,4,5]
let res = arr.findIndex(item=>item>2)
console.log(res) //2
3、JS模拟实现
/**
* @function find函数
* @param arr 数组
* @param callback 回调函数
*/
function findSimulate(arr,callback){
let result = null
for(let i=0;i<arr.length;i++){
if(callback(arr[i])){
result = arr[i]
return result
}
}
}
let arr = [1,2,3,4,5]
let res = findSimulate(arr,item=>item>2)
console.log(res) //3
/**
* @function findIndex函数
* @param arr 数组
* @param callback 回调函数
*/
function findSimulate(arr,callback){
let result = null
for(let i=0;i<arr.length;i++){
if(callback(arr[i])){
result = i
return result
}
}
}
let arr = [1,2,3,4,5]
let res = findSimulate(arr,item=>item>2)
console.log(res) //2
五、some和every
1、定义 some:遍历数组如果有一个条件满足就返回true,全部不满足返回false evey:遍历数组如果每一项都满足条件就返回true,否则返回false 2、使用
let arr = [1,2,3,4,5]
let res = arr.some(item=>item>1)
console.log(res) //true
let arr = [1,2,3,4,5]
let res = arr.every(item=>item>1)
console.log(res) //false
3、JS代码实现
/**
* @function some函数
* @param arr 数组
* @param callback 回调函数
*/
function someSimulate(arr,callback){
let result = false
for(let i=0;i<arr.length;i++){
if(callback(arr[i])){
result = true
}
}
return result
}
let arr = [1,2,3,4,5]
let res = someSimulate(arr,(item)=>item>1)
console.log(res) //true
/**
* @function every函数
* @param arr 数组
* @param callback 回调函数
*/
function everySimulate(arr,callback){
let result = true
for(let i=0;i<arr.length;i++){
if(!callback(arr[i])){
result = false
}
}
return result
}
let arr = [1,2,3,4,5]
let res = everySimulate(arr,(item)=>item>1)
console.log(res) //false
六、数组去重的三种方式
(1)new Set()
/**
* @function 数组去重
* @param arr 数组
*/
function deweight(arr){
return [...new Set(arr)]
}
let arr = [1,2,3,1,2,3,4,5,6,5]
let result = deweight(arr)
console.log(result) //[1,2,3,4,5,6]
(2)forEach加indexOf
function deweight(arr){
let newArr = []
arr.forEach(item => {
if(newArr.indexOf(item) === -1 ){
newArr.push(item)
}
});
return newArr
}
let arr = [1,2,3,1,2,3,4,5,6,5]
let result = deweight(arr)
console.log(result) //[1,2,3,4,5,6]
(3)forEach加对象判断
function deweight(arr){
let newArr = []
let newObj = {}
arr.forEach(item => {
if(!newObj[item]){
newArr.push(item)
newObj[item] = true
}
});
return newArr
}
let arr = [1,2,3,1,2,3,4,5,6,5]
let result = deweight(arr)
console.log(result) //[1,2,3,4,5,6]
七、concat数组合并
1、定义 数组和其他数组或者数值进行合并 2、使用:
let arr1 = [1,2,3]
let result = arr1.concat([4,5,6,7],8,9)
console.log(result) //[1, 2, 3, 4, 5, 6, 7, 8, 9]
3、使用JS模拟实现
function concatSimulate(arr1,...arg){
let result = arr1
let newArg = [...arg]
newArg.forEach(item=>{
if(Array.isArray(item)){
result.push(...item)
}else{
result.push(item)
}
})
return result
}
let arr1 = [1,2,3]
let result = concatSimulate(arr1,[4,5,6],7,8)
console.log(result)//[1, 2, 3, 4, 5, 6, 7, 8, 9]
八、slice()数组切割
1、定义 数组的切割,接收两个参数,第一个为开始截取的位置,包含截取的位置,第二个截取结束的位置,不包含结束位置的截取,开始位置大于数组总长度默认返回空数组,结束位置大于总长度或者不穿,则截取到最后一位。返回一个截取后的新数组,原数组不改变。 2、使用:
let arr1 = [1,2,3,4,5,6,7,8]
let result = arr1.slice(0,2)
console.log(result)// [1,2]
3、使用JS模拟实现
function sliceSimulate(arr,start,end){
let result = []
//start传的值大于数组长度,直接返回空数组
if(start>arr.length){
return []
}
//end不传或者大于数组长度,截取到最后一位
if(!end||end>arr.length){
end = arr.length
}
for(let i= 0;i<arr.length;i++){
if(i>=start&&i<end){
result.push(arr[i])
}
}
return result
}
let arr = [1,2,3,4,5,6,7,8]
let result = sliceSimulate(arr,2) //[1,2]
console.log(result)
九、数组扁平化
1、定义:将多维数组转换成一维数组
2、使用递归的方式
function flatttening(arr){
let result = []
for(let i = 0;i<arr.length;i++){
if(Array.isArray(arr[i])){
result.push(...flatttening(arr[i]) )
}else{
result.push(arr[i])
}
}
return result
}
let arr = [1,2,3,[2,3,4,[5,5,6]],4,5,6,[7,8]]
let result = flatttening(arr)
console.log(result)//[1, 2, 3, 2, 3, 4, 5, 5, 6, 4, 5, 6, 7, 8]
3、使用map加concat 更加简便的实现方式
function flatttening(arr){
while(arr.some(item=>Array.isArray(item))){
arr = [].concat(...arr)
console.log(arr)
}
return arr
}
let arr = [1,2,3,[2,3,4,[5,5,6]],4,5,6,[7,8]]
let result = flatttening(arr)
console.log(result)//[1, 2, 3, 2, 3, 4, 5, 5, 6, 4, 5, 6, 7, 8]