JavaScript 数组的常用方法

大家好，欢迎来到IT知识分享网。

在我们前端来说数组作为一个常用的类型，今天我们讲一下在实际使用中经常用到的方法和使用场景。

concat() 多数组组合

concat() 可以用来连接两个或多个数组，返回要给新的数组并且不会影响之前的数组。

使用方法：arr.concat(arr1,arr2,……,arrn) 他的参数可以是多个数组。实例如下：

var arr = [1,2,3]; var arr1 = [4,5,6]; var arr2 = [7,8,9]; arr.concat(arr1,arr2) 输出结果： [1,2,3,4,5,6,7,8,9]

join()将数组元素连接到一起

join()方法是把数组中所有的元素通过指定的分隔符连接成一个统一的字符串。

实例如下：

var arr = ["str1","str2","str3"] arr.join("#") 输出结果： str1#str2#str3

pop()删除数组的最后元素

pop() 是用来删除数组的最后一个元素。咱们直接上实例：

var arr = ["str1","str2","str3"] arr.pop() 输出结果： ["str1","str2"]

push()往数组结尾添加元素

push() 方法适用于向数组的末尾添加一个或多个元素。

使用方法：

arr.push(obj1,obj2,……objn) 我们可以看到这个方法可以添加多个参数。具体实例如下：

var arr = ["str1","str2","str3"] arr.push("obj1","obj2","obj3") 输出结果： ["str1","str2","str3","obj1","obj2","obj3"] 

unshift()往数组开头添加元素

unshift() 方法适用于向数组的末尾添加一个或多个元素。也可以添加多个参数。具体实例如下：

var arr = ["str1","str2","str3"] arr.unshift("obj1","obj2","obj3") 输出结果： ["obj1", "obj2", "obj3", "str1", "str2", "str3"

forEach() 和for()数组循环遍历

共同点：两者都是用于对数组的循环遍历

var arr = ["str1","str2","str3"] for (let index = 0; index < this.arr.length index const element='this.arr[index];' console.logelement> { console.log(element) }); 输出结果相同： ["str1","str2","str3"]

不同点：for 可以中途中断 但是forEach不行他会执行完整个数组元素

var arr = ["str1","str2","str3"] for (let index = 0; index < this.arr.length index const element='this.arr[index];' console.logelement ifindex='=1){' return> { console.log(element) return }); 输出结果： ["str1","str2"] 输出结果： ["str1","str2","str3"] 

我们看出for函数只输出了两个值就中断了 但是forEach确将所有的数据都输出了。整个地方是特别容易出错并且不容易找出错误的地方。所以大家一定要区分开两个函数的共同点和区别。

map(）函数

map函数可以根据之前的对象根据某个条件进行某种变换，生成另外一个新的对象。

 let arr=[1,2,3] let createArr=arr.map(item=>{ return item*2 }) 输出结果： [2,4,6]

filter() 函数

filter函数用于数组中获取过滤符合条件的所有元素，返回过滤后的数组，如果没有符合条件的元素则返回空数组。

let arr=[1,2,3] let arr2=arr.filter(item=>{ return item.value>1 }) 输出结果： [2,3]

find()函数

find()函数查找符合条件的值，不过有几点注意事项：

1、返回符合条件的第一个元素的值，多符合也只是返回一个。

2、如果没有符合判断条件的则返回 undefined。

let arr=[1,2,3] let arr2=arr.find(item=>{ return item.value==1 }) 输出结果： [1]