Skip to content

js基础-常用的高阶函数 #1

Description

@jmy2123

forEach

遍历数组中的每一项,为每个元素调用制定的函数

  • 是es5 的方法 (IE9 以下不可用)
  • 可替代 for 循环,但是 forEach 不能中断循环(不能使用break 或者 return 语句)

注意:forEach 无法再所有元素都传递给调用函数之前终止遍历,也就是说,没有像for循环中使用的相应的break语句。如果要提前终止,必须把forEach() 方法放在一个try块中,并能抛出一个异常。如果forEach() 调用的函数抛出foreach.break异常,循环会提前终止。

这里简单提一下 for in 和 for of

  • for...in 循环只遍历可枚举属性
let obj1 = ['judy', 'nick']
for (let key in obj1) {
    console.log(key) // 0 1
}

let obj = {name: 'judy', age: 18}
for (let key in obj) {
    console.log(key) // name age
}
  • for of 是es6方法 可以代替 forEach方法
let obj = ['judy', 'nick']
for (let value of obj) {
    console.log(value) // judy nick
}

for of 不能用在普通的对象上,可以使用Object.keys() 按照对象所拥有的属性进行
let obj = {name: 'judy', age: 18}
for (var key of Object.keys(obj)) {
  console.log(key + ": " + obj[key]);
  // name: judy age: 18
}

重点区别一下 map filter reduce

map

遍历数组里的每一项,得到一个新的数组, 新数组长度 = 原长度

  • 传递给map() 的函数的调用方式和传递给forEach() 函数的调用方式一样。但传递给map() 的函数应该有返回值

注意:map()返回的是新数组,不是修改调用的数组

let result = [1, 2, 3].map(item => {
    return item * 2
})
console.log('result2:', result) // [ 2, 4, 6 ]

filter

根据某一规则过滤数组中符合要求的项,过滤之后的数组长度 <= 原长度

  • 返回数组元素是调用数组元素的子集
  • 传递的函数是用来逻辑判定的:该函数返回true或者false
注意: filter会跳过稀疏数组中缺少的元素,返回的数组总是稠密的

1.为了压缩稀疏数组的空缺,可如下:
var b = a.filter(function() {return true;})

2. 压缩空缺并删除undefined 和 null 元素,可以如下:
a = a.filter(function(x) {return x !== undefined && x != null} )
let result = [1, 2, 3, 4].filter(item => {
    return item % 2 === 0
})
console.log('result1:', result) // [2, 4]

reduce

遍历数组中的每一项组合生成单个值,这个结果可以是任意类型

注意: 在空数组上,不带初始值参数调用reduce() 将导致类型错误异常。
如果调用他的时候只有一个值(数组只有一个元素并且没有指定初始值,或者有一个空数组并且指定一个初始值),
reduce() 只是简单地返回那个值而不会调用简化函数
let num = 1
let result = [1, 2, 3].reduce((total, item) => {
    return total + item
}, num)
console.log('result:', result) // 7

some

是数组的逻辑判定

  • 根据指定函数 对数组元素进行判定
  • 遍历过程中,判定函数第一次返回true 则停止遍历,返回true;如果一直没有元素返回true,则一直遍历,直到结束,返回false
let arr = [1,2,3,4]
arr.some(function (item) {
    return item > 5
})
// false

arr.some(function (item) {
    return item % 2 === 0
})
// true

every

是数组的逻辑判定

  • 根据指定函数 对数组元素进行判定
  • 遍历过程中,判定函数第一次返回false 则停止遍历,返回false;如果一直没有元素返回false,则一直遍历,直到结束,返回挥true
let arr = [1,2,3,4]
arr.every(function (item) {
    return item < 5   
})
// true

arr.every(function (item) {
    return item % 2 === 0
})
// false

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions