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

我心飞翔 分类:javascript
有关增的方法
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);

回复

我来回复
  • 暂无回复内容