JavaScript 数组纯函数

Nian糕

修改于 2024-03-19 14:39:12

1.3K0

修改于 2024-03-19 14:39:12

文章被收录于专栏：JavaScript高阶应用

常用的数组 API

forEach 遍历所有元素，item 对应的是元素的值，index 对应的是元素的位置

let arr = [4, 6, 8];
arr.forEach(function(item, index){
  console.log(index, item)
})
// 0 4
// 1 6
// 2 8

every 判断所有元素是否都符合条件

let arr = [4, 6, 8];
let result = arr.every(function(item, index){
  if(item < 10) {
    return true
  }
})
console.log(result) // true

some 判断是否有至少一个元素符合条件

let arr = [4, 6, 8];
let result = arr.some(function(item, index){
  if(item < 7) {
    return true
  }
})
console.log(result) // true

sort 排序

arr.sort([compareFunction])，如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前，如果没有指明 compareFunction，那么元素会按照转换为的字符串的诸个字符的 Unicode 位点进行排序

let arr = [4, 3, 6, 2, 8];
let result = arr.sort(function(a, b){
  return a - b
})
console.log(result) // [ 2, 3, 4, 6, 8 ]

map 对元素重新组装，生成新数组

let arr = [4, 3, 6, 2, 8];
let result = arr.map(function(item, index){
  return item
})
console.log(result) // [ 4, 3, 6, 2, 8 ]

filter 通过某一条件过滤数组

let arr = [4, 3, 6, 2, 8];
let result = arr.filter(function(item, index){
  if(item >= 5) {
    return true
  }
})
console.log(result) // [ 6, 8 ]

纯函数

纯函数有两个特点：1. 不改变原数组（没有副作用）；2. 返回一个数组

除了上面提到的 forEach, every, some, filter 属于非纯函数外，我们常用的 push, pop, shift, unshift 方法也属于非纯函数

const arr = [10, 20, 30, 40]

const popRes = arr.pop()
const shiftRes = arr.shift()
const pushRes = arr.push(50) // 返回 length
const unshiftRes = arr.unshift(5) // 返回 length

console.log(popRes, arr) // 40 [ 10, 20, 30 ]
console.log(shiftRes, arr) // 10 [ 20, 30 ]
console.log(pushRes, arr) // 3 [ 20, 30, 50 ]
console.log(unshiftRes, arr) // 4 [ 5, 20, 30, 50 ]

常用的数组纯函数除了 sort, map, filter 之外，还有 concat 和 slice

const arr = [10, 20, 30, 40]

const concatRes = arr.concat([50, 60])
const sliceRes = arr.slice()

console.log(concatRes) // [10, 20, 30, 40, 50, 60]
console.log(sliceRes) // [ 10, 20, 30, 40 ]

需要区分 slice 和 splice 的区别，slice 为纯函数，splice 为非纯函数

const arr = [10, 20, 30, 40, 50]

// slice 纯函数
const sliceRes1 = arr.slice(1, 4)
const sliceRes2 = arr.slice(2)
const sliceRes3 = arr.slice(-3)

console.log(sliceRes1, arr) // [ 20, 30, 40 ] [ 10, 20, 30, 40, 50 ]
console.log(sliceRes2, arr) // [ 30, 40, 50 ] [ 10, 20, 30, 40, 50 ]
console.log(sliceRes3, arr) // [ 30, 40, 50 ] [ 10, 20, 30, 40, 50 ]


// splice 非纯函数
const spliceRes1 = arr.splice(1, 2, 'a')
const spliceRes2 = arr.splice(1, 2)
const spliceRes3 = arr.splice(1, 0, 'a')
console.log(spliceRes1, arr) // [ 20, 30 ] [ 10, 'a', 50 ]
console.log(spliceRes2, arr) // [ 'a', 40 ] [ 10, 'a', 50 ]
console.log(spliceRes3, arr) // [] [ 10, 'a', 50 ]

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法