JavaScript 数组精简技巧小结

在 JavaScript 中，数组操作是非常常见的操作。本文将总结一些数组精简技巧，帮助你在编程过程中更高效地使用数组。

1. 查询元素是否在数组中

在 JavaScript 中，可以通过 indexOf() 方法查询数组中是否包含某一元素，它会返回该元素在数组中的索引位置，如果数组中不存在该元素，返回 -1。

示例一

const arr = [0, 1, 2, 3, 4]
console.log(arr.indexOf(2)) // 输出结果: 2
console.log(arr.indexOf(5)) // 输出结果: -1

示例二

若要判断一个数组中是否包换某个元素，可以使用 includes() 方法，该方法返回一个布尔值，表示该元素是否存在于数组中。

const arr = [0, 1, 2, 3, 4]
console.log(arr.includes(2)) // 输出结果: true
console.log(arr.includes(5)) // 输出结果: false

2. 数组去重

在 JavaScript 中，可以借助 Set 或 forEach 去重。其中 Set 是 ES6 引入的新特性，可以创建一个无重复元素的数组。

示例一

const arr = [1, 2, 3, 3, 4, 4]
const set = new Set(arr)
const newArr = Array.from(set)
console.log(newArr) // 输出结果: [1, 2, 3, 4]

示例二

const arr = [1, 2, 3, 3, 4, 4]
const newArr = []
arr.forEach(item => {
  if (newArr.indexOf(item) === -1) {
    newArr.push(item)
  }
})
console.log(newArr) // 输出结果: [1, 2, 3, 4]

3. 将数组转为用逗号隔开的字符串

在 JavaScript 中，可以使用 join() 方法将数组转换为字符串，它可以接收一个参数，表示用什么符号来分隔数组中的元素。如果没有传参，默认用逗号隔开。

示例一

const arr = ['apple', 'banana', 'orange', 'pear']
console.log(arr.join()) // 输出结果: 'apple,banana,orange,pear'
console.log(arr.join(' & ')) // 输出结果: 'apple & banana & orange & pear'

示例二

const arr = ['apple', 'banana', 'orange', 'pear']
let str = ''
for (let i = 0; i < arr.length; i++) {
  str += arr[i]
  if (i !== arr.length -1 ) {
    str += ', '
  }
}
console.log(str) // 输出结果: 'apple, banana, orange, pear'

4. 将数组中的元素根据条件筛选出来

在 JavaScript 中，可以借助 filter() 方法，筛选满足条件的元素，然后将这些元素存入一个新的数组返回。

示例一

const arr = [1, 2, 3, 4, 5]
const newArr = arr.filter(item => item > 2)
console.log(newArr) // 输出结果: [3, 4, 5]

示例二

const arr = [1, 2, 3, 4, 5]
const newArr = []
for (let i = 0; i < arr.length; i++) {
  if (arr[i] > 2) {
    newArr.push(arr[i])
  }
}
console.log(newArr) // 输出结果: [3, 4, 5]

5. 计算数组中元素的总和

在JavaScript中，可以借助reduce()方法，将数组中的各个元素累加，最终返回总和。该方法接受一个回调函数和一个计算时的初始值。

示例一

const arr = [1, 2, 3, 4, 5]
const sum = arr.reduce((prev, next) => prev + next, 0)
console.log(sum) // 输出结果: 15

示例二

const arr = [1, 2, 3, 4, 5]
let sum = 0
for (let i = 0; i < arr.length; i++) {
  sum += arr[i]
}
console.log(sum) // 输出结果: 15

通过这些数组操作精简技巧，你可以让你的 JavaScript 代码更加简洁、高效。