👨🏻‍💻 了解 JavaScript 最强大的💪函数

嗨，Dev，感谢你打开我的博客。希望你一切顺利，并准备好学习 JavaScript 中最强大的功能。

为什么这是最强大的？

是的，这是最强大的函数，这个单一函数可以完成其他数组原型的所有内容，值得分享

那么让我们开始吧

Reduce 函数对数组的每个元素执行 Reducer 函数，最终得到单个输出值。Reducer 由程序员提供。

工作原理

reduce 方法接受 2 个参数。

首先是传递给 reduce 方法的函数，它接受四个参数。

累加器 (Accumulator)：它是上次回调调用中返回的累加值，如果提供了 initialValue，则为 initialValue。Reducer 的返回值会被赋值给累加器。累加器会在数组的每次迭代中被记住，并最终成为最终的单一结果值。

当前值：当前元素的值。

current Index：数组中当前正在处理的元素的索引。如果提供了 initialValue，则从索引 0 开始。否则，从索引 1 开始。

源数组：被迭代的数组

第二个参数是回调函数首次调用时用作第一个参数的值。如果未提供 initialValue，则数组中的第一个元素将用作累加器的初始值，并跳过 currentValue 的设置。对空数组调用 reduce() 时，如果没有提供 initialValue，
则会抛出 TypeError。初始值可以是变量、数组或对象。

Reduce 的用法

1）数组求和：让我们从基础的开始，然后深入研究 reduce

让 sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
    console.log("累加器为 "+累加器+ " 和当前值
     是“+当前值）；
    返回累加器+当前值；
})

如上面的代码所示，我们还没有传递初始值，所以累加器的值将是数组的第一个索引（0），当前值将是第二个索引（1）。
输出将是

累加器为 0，当前值为 1
累加器为 1，当前值为 2
累加器为 3，当前值为 3

现在让我们给出初始值

让 sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
    console.log("累加器为 "+累加器+ " 和当前值
     是“+当前值）；
    返回累加器+当前值；
},5)

并查看输出

累加器为 5，当前值为 0
累加器为 5，当前值为 1
累加器为 6，当前值为 2
累加器为 8，当前值为 3

我希望你理解累加器和初始值的工作原理。

2）从现有数组创建新数组

假设我们有一个学生的 JSON 数组，我们想创建一个仅包含姓名和学号的新数组。当然，您可以使用循环或使用 Map 返回新数组来做到这一点，但在这里，我们只会使用 reduce。

var 学生 = [
    {
        名字：“库沙尔”，
        班级：“MCA”，
        结果：“通过”，
        手机号：“995481”
    }，
      {
        名字：“拉胡尔”，
        类：“BCA”，
        结果：“通过”，
        手机号码：“993281”
    }，
      {
        名字：“库沙尔”，
        班级：“MCA”，
        结果：“通过”，
        手机号：“989481”
    }
]；

const studentWithMobileNo = students.reduce((function(acc,student){
    返回 [...acc,{name:student.name,mobileNo:student.mobileNo}]
}),[])
console.log(学生使用手机号码)；

这里我们用空数组初始化累加器，然后借助 Reducer 函数创建一个新数组。

上述输出将是

[
  { name: 'Kushal', mobileNo: '995481' },
  { 姓名：'Rahul'，手机号码：'993281' }，
  { name: 'Kushal', mobileNo: '989481' }
]

过滤数组

现在假设我们只想从学生的数组中获取通过记录，这可以通过一个非常简单的方法来实现

const PassedStudents = students.reduce((function(acc,student){
     返回 student.result == "Pass" ? [...acc,student] : acc
}),[])

Reduce 可以做更多的事情，希望你喜欢这篇文章并理解 Reduce 函数。
感谢阅读 ❤ ❤ 并关注我，以便及时了解我的最新博文。

要了解我的最新动态，请在 Twitter 上关注我。==> Kushal Sharma