Js数组经常用到的一些方法
程序员文章站
2023-12-22 14:15:52
...
数组的方法异常之多,现在罗列的是我项目中经常用到的方法
1、unshift 将指定元素插入数组的第一个位置
let arr = [22, 33, 44]
arr.unshift(11)
console.log(arr) // [11, 22, 33, 44]
2、shift 删除数组的第一个元素
let arr = [11, 22, 33, 44]
arr.shift()
console.log(arr) // [22, 33, 44]
3、push 将指定元素添加到数组的最后一个位置
let arr = [11, 22, 33, 44]
arr.push(55)
console.log(arr) // [11, 22, 33, 44, 55]
4、pop 删除数组的最后一个元素
let arr = [11, 22, 33, 44]
arr.pop()
console.log(arr) // [11, 22, 33]
5、join 将数组以指定符号拼接成字符串
let arr = [11, 22, 33]
let str1 = arr.join('-')
let str2 = arr.join('')
let str3 = arr.join('+')
console.log(str1) // 11-22-33
console.log(str2) // 112233
console.log(str3) // 11+22+33
6、indexOf 判断数组中是否存在指定的元素
let arr = [11, 22, 33]
let index1 = arr.indexOf(22)
let index2 = arr.indexOf(55)
console.log(index1) // 若存在,返回指定元素所在下标
console.log(index2) // 若不存在, 返回-1
7、concat 将两个数组拼接合并成一个数组
let arr1 = [11, 22, 33]
let arr2 = [44, 55, 66]
let arr3 = arr1.concat(arr2)
console.log(arr3) // [ 11, 22, 33, 44, 55, 66 ]
8、slice 可用于截取指定范围的数据
let arr = [11, 22, 33, 44, 55, 66]
// 第一个参数:要开始截取的元素下标 第二个参数: 要截取的位数
let arr1 = arr.slice(0, 2)
console.log(arr1) // [11, 22]
// 只有一个参数时,表示从要开始截取的元素开始,一直截取到最后一个元素
let arr2 = arr.slice(3)
console.log(arr2) // [ 44, 55, 66 ]
// 当参数是负数时,会自动转成正数截取
let arr3 = arr.slice(-3, -1)
console.log(arr3) // [44, 55]
9、foreach 遍历数组,我一般都是把数据处理下push到其他数组中
let arr = [11, 22, 33, 44]
arr.forEach((e, index, arr) => {
console.log(e) // 每次遍历对应的元素
console.log(index) // 对应元素的下标
console.log(arr) // 原数组
})
10、map 遍历数组,可以处理每个元素并返回新的值 (比foreach好用)
// 数组对象
let arr = [
{name: 'lily', age: '18'},
{name: 'jack', age: '20'},
{name: 'lucy', age: '28'},
{name: 'rose', age: '32'},
]
// 可以处理每一项元素的数据,返回自己想要的结构
let newArr = arr.map(item => {
return {
realName: item.name + '000'
}
})
console.log(newArr)
// [
// { realName: 'lily000' },
// { realName: 'jack000' },
// { realName: 'lucy000' },
// { realName: 'rose000' }
// ]
// 数组
let arr = [11, 22, 33, 44, 55]
let arr2 = arr.map(e => {
return e + 10
})
console.log(arr2) // [ 21, 32, 43, 54, 65 ]
11、filter 可以当作过滤器使用
let arr = [
{name: 'lily', age: '18'},
{name: 'jack', age: '20'},
{name: 'lucy', age: '28'},
{name: 'rose', age: '32'},
]
let newArr = arr.filter((item, index) => {
console.log(item) // 每一项元素
console.log(index) // 对应元素下标
return parseInt(item.age) > 18 // 返回符合条件的数据
})
console.log(newArr)
// [
// { name: 'jack', age: '20' },
// { name: 'lucy', age: '28' },
// { name: 'rose', age: '32' }
// ]
还有some、every等一些方法,但我基本上没用过, 上面差不多能满足我的需求了
至于一些比较复杂的数据逻辑要处理的,推荐大家可以去看看lodash.js,封装了系列的方法,简直很棒