数组方法及常见数组面试题

有关增的方法

1.push

注意点1：它是将新增的元素添加到数组的尾部
注意点2：它会改变原数组
注意点3：并且返回的值为新数组的长度
举例：

 var arr=[1,2,3]
 var newarr = arr.push(4)
 console.log(arr);  //[1,2,3,4]
 console.log(newarr);//4
复制代码

2.unshift

注意点1：它是将新增的元素添加到数组的头部
注意点2：它会改变原数组
注意点3：并且返回的值为新数组的长度

var arr=[1,2,3]
var newarr = arr.unshift(5)
console.log(arr);//[5,1,2,3]
console.log(newarr);//4
复制代码

3.splice

重量级的人物来了，它不仅可以添加元素，删除，还可以替换，我们先来说它的添加用法

注意点1：可以添加元素至任意位置
注意点2：它会改变原数组
注意点3：参数1为你要添加的位置start的index（会添加到这个的前面），参数2为0，参数3为你要添加的元素（是添加元素时各个参数代表的意义哦！！）

var arr=[1,2,3]
var newarr = arr.splice(0,0,1)
console.log(arr);//[1,1,2,3]
console.log(newarr);//[]
复制代码

4.concat

这个方法常常用了拼接数组

注意点1：这个方法不会改变原数组

var arr=[1,2,3,2,9]
var newarr = arr.concat(1,2)
console.log(arr);//[1,2,3,2,9]
console.log(newarr);//[1,2,3,2,9,1,2]

var arr2=[1,0]
var newarr2 = arr.concat(arr2)
console.log(newarr2);//[1,2,3,2,9,1,0]
复制代码

有关删的方法

1.pop

注意点1：删除尾部的元素
注意点2：改变原数组
注意点3：返回的是删除的那个元素

var arr=[1,2,3]
var newarr = arr.pop()
console.log(arr);//[1,2]
console.log(newarr);//3
复制代码

2.shift

注意点1：删除的是头部元素
注意点2：改变原数组
注意点3：返回的是被删除的那个元素

var arr=[1,2,3]
var newarr = arr.shift()
console.log(arr);//[2,3]
console.log(newarr);1
复制代码

3.splice

老盆友又见了，这次来看下删除的用法

注意点1：删除任意位置的元素
注意点2：改变元素组
注意点3：返回的是删除元素数组（你没看错是数组！！）
注意点4：参数1：为从哪开始删start的index，参数2：删除几个元素

 var arr=[1,2,3]
var newarr = arr.splice(0,1)
console.log(arr);//[2,3]
console.log(newarr);[1]
复制代码

4.slice

这个更像是截取，暂且归到这一类吧

注意点1：参数1为start的index，参数2为end的index(前包后不包哦)
注意点2：他不会改变原数组，并且将截取的元素新数组返回

var arr=[1,2,3,2,9]
var newarr = arr.slice(1,2)
console.log(arr);//[1,2,3,2,9]
console.log(newarr);//[2]
复制代码

改的方法

1.splice

注意点1：改任意位置的元素
注意点2：改变原数组
注意点3：返回的新数组为替换下来的元素
注意点4：参数1：如上，参数2：删除几个，参数3：要填上去的元素

 var arr=[1,2,3]
var newarr = arr.splice(0,1,4)
console.log(arr);//[4,2,3]
console.log(newarr);//[1]
复制代码

查的操作

1.indexOf

注意点1：传入的为你要查找的元素，找到返回该元素在数组中的索引，没找到返回-1

var arr=[1,2,3]
var newarr = arr.indexOf(1)
console.log(newarr);// 0
复制代码

2.includes

注意点1：传入你要查找的元素，返回true/false

var arr=[1,2,3]
var newarr = arr.includes(1)
console.log(newarr);//true
复制代码

3.find

注意点：传入的是一个函数，返回第一个匹配的元素

var arr=[1,2,3,2,9]
var newarr = arr.find((item,index)=>{
    return item>2
})
console.log(newarr);//3
复制代码

排序方法

1.sort

注意点：将原数组排序

var arr=[1,2,3,2,9]
arr.sort()
console.log(arr);//[1,2,2,3,9]
复制代码

也可以自定义

var arr=[1,2,3,2,9]
//e1表示前一个元素，e2表示后一个元素
arr.sort((e1,e2)=>{
    return e1-e2
})
console.log(arr);//[1,2,2,3,9]
复制代码

2.reverse

注意点：将原数组倒序

var arr=[1,2,3,2,9]
arr.reverse()
console.log(arr);
复制代码

转换方法

1.join

注意点：将数组转化为字符串，不改变原数组

var arr=[1,2,3,2,9]
var newarr= arr.join(',')
console.log(newarr);//1,2,3,2,9
console.log(arr);//[1,2,3,2,9]
复制代码

迭代方法

1.some

注意点：将数组每一项传入函数中，如果有一个符合添加就返回true

var arr=[1,2,3,2,9]
var newarr= arr.some((item,index)=>{
    return item>2
})
console.log(newarr);//true
复制代码

2.every

注意点：将数组每一项传入一个函数，如果每一项都符合条件才返回true

var arr=[1,2,3,2,9]
var newarr= arr.every((item,index)=>{
    return item>2
})
console.log(newarr);//false
复制代码

3.forEach

注意点1：forEach(function(){},obj)方法仅仅是一种快速迭代数组的方式，首先会遍历数组的每一个元素传入到函数中
注意点2：该方法不需要返回值
注意地3：参数二为this指向

var arr=[1,2,3,2,9]
var newarr= arr.forEach(element => {
    console.log(element);
})
console.log(newarr);//undefined
复制代码

4.map

注意点1:提供的是一种映射函数,将数组的每一项传入到函数
注意点2：元素会经过函数中的指令进行各种变换，生成新的元素，并且将新的元素返回
注定点3：最终会将返回的所有元素形成一个新的数组，该数组就是map()最终返回的值

var arr=[1,2,3,2,9]
var newarr= arr.map(element => {
    return element*2
})
console.log(newarr);//[2, 4, 6, 4, 18]
复制代码

5.reduce

arr.reduce(callback, initialValue)
callback（一个在数组中每一项上调用的函数，接受四个函数分别为：
previousValue（上一次调用回调函数时的返回值，或者初始值）
currentValue（当前正在处理的数组元素）
currentIndex（当前正在处理的数组元素下标）
array（调用reduce()方法的数组）
initialValue（可选的初始值。作为第一次调用回调函数时传给previousValue的值）

reduce应用：1.做累加2.数组扁平化3.属性对object分类4.数组去重等等

常见数组面试题

1.数组去重

(1)利用set

var arr=[1,2,3,2,9]
var newarr = [...new Set(arr)]
console.log(newarr);//[1, 2, 3, 9]
复制代码

(2)利用indexOf

var arr=[1,2,3,2,9]
function fn(arr){
    var newarr=[]
    arr.filter((item,index)=>{
        if(newarr.indexOf(item)==-1){
            newarr.push(item)
        }
    })
    return newarr
}
console.log(fn(arr));//[1, 2, 3, 9]
复制代码

(3)利用includes

var arr=[1,2,3,2,9]
function fn(arr){
    var newarr=[]
    arr.filter((item,index)=>{
        if(!newarr.includes(item)){
            newarr.push(item)
        }
    })
    return newarr
}
console.log(fn(arr));
复制代码

(4)利用reduce

var arr=[1,2,3,2,9]
function fn(arr){
    var newarr=[]
    arr.sort().reduce((pre,value,index)=>{
        //比较pre中最后一个元素和当前的值是否相等，不相等加入新数组
         if (pre[index-1]!==value) {
            newarr.push(value)
         }
         return newarr
    },[])
    return newarr
}
console.log(fn(arr));
复制代码

2.数组扁平化

（1）利用flat

注意此api不传参数就只能深度到1，参数代表着深度，当不知道深度时可以传Infinity

var arr=[1,2,3,2,9,[2,3,[1]]]
console.log(arr.flat());//[1, 2, 3, 2, 9, 2, 3, Array(1)]
var arr=[1,2,3,2,9,[2,3,[1]]] 
console.log(arr.flat(Infinity));//[1, 2, 3, 2, 9, 2, 3, 1]
复制代码

（2）利用reduce

var arr=[1,2,3,2,9,[2,3,[1]]]
function flat(arr){
    return arr.reduce((pre,value,index)=>{
        return pre.concat(Array.isArray(value)?flat(value):value)
    },[])
}
console.log(flat(arr));//[1, 2, 3, 2, 9, 2, 3, 1]
复制代码

（3）将数组转为字符串，再转为数组

var arr=[1,2,3,2,9,[2,3,[1]],[2,3]]
//数组转为字符串，再将字符串转为数组
var newarr = arr.join(',').split(',').map((item,index)=>{
    return parseInt(item)
})
console.log(newarr);//[1, 2, 3, 2, 9, 2, 3, 1, 2, 3]
复制代码

3.判断数组元素出现个数

例如：var arr=[‘name’,’age’,’hhh’,’hhh’]各出现多少次

var arr=['name','age','hhh','hhh']
var newarr = arr.reduce((pre,item,index)=>{
    if (!pre[item]) {
        pre[item]=1
    }else{
        pre[item]++
    }
    return pre
},{})
console.log(newarr);
复制代码

4.判断数组中出现次数最多的元素

在统计个元素出现个数的基础上

var arr=['name','age','hhh','hhh']
var newarr = arr.reduce((pre,item,index)=>{
    if (!pre[item]) {
        pre[item]=1
    }else{
        pre[item]++
    }
    return pre
},{})
var max=0//最多的数量
var attr//最多的属性是什么
for (const key in newarr) {
    //key为属性
    console.log(newarr[key]);
    if (newarr[key]>max) {
        max=newarr[key]
        attr=key
    }
}
console.log(max,attr);
复制代码

5.统计数组中重复的元素

var arr=[1,2,6,2,9,1]
console.log(arr.sort());
var arr2=[]
arr.sort().sort((e1,e2)=>{
    e1===e2?arr2.push(e2):''
})
console.log(arr2);
复制代码

6.在a不在b

现在两个数组，判断在a中的元素，不在b中
const a = [1,2,3,5]
const b=[1,3,5,6]

const a = [1,2,3,5]
const b=[1,3,5,6]
const newarr = a.filter((item,index)=>{
//将在a不在b中的筛选出来
   return b.indexOf(item)==-1
})
console.log(newarr);
复制代码

综合习题

公司前后招聘了10个员工(性别,年龄, 月薪各不相同),有以下需求
1). 列表显示所有员工的所有信息
2). 对员工进行年薪降序列表显示
3). 得到男员工的总月薪
4). 查找一个月薪只比12000高一点点的员工
5). 查找出所有月薪高于12000的员工

const employees = [
   {name: 'A', sex: '男', age: 21, salary: 10000},
   {name: 'B', sex: '女', age: 25, salary: 12000},
   {name: 'C', sex: '男', age: 24, salary: 13000},
   {name: 'D', sex: '男', age: 24, salary: 12500},
   {name: 'E', sex: '女', age: 21, salary: 14000},
   {name: 'F', sex: '男', age: 24, salary: 16000},
   {name: 'G', sex: '男', age: 23, salary: 9000},
   {name: 'H', sex: '女', age: 21, salary: 11000},
   {name: 'I', sex: '男', age: 23, salary: 13200},
   {name: 'J', sex: '男', age: 23, salary: 15000}
]
复制代码

1)employees.forEach((item,index)=>{
    console.log(item);
})

2)var newArr= employees.sort((e1,e2)=>{
    return e2.salary-e1.salary
})
console.log(newArr);

3)var newArr= employees.reduce((pre,item)=>{
    return pre = item.sex==='男'?pre+item.salary:0
},0)
console.log(newArr);

4)var newArr= employees.sort((e1,e2)=>{
    return e1.salary-e2.salary
}).find((item,index)=>{
    return item.salary>12000
})
console.log(newArr);

5)var newArr = employees.filter((item,index)=>{
    return item.salary>12000
})
console.log(newArr);
复制代码