闭包进阶应用（3）-重写 reduce；柯里化函数思想；两道面试题

最新推荐文章于 2024-06-13 16:25:58 发布

原创最新推荐文章于 2024-06-13 16:25:58 发布

· 182 阅读

1 ·

版权

文章标签：

#面试 #javascript #vue.js

前端同时被 2 个专栏收录

18 篇文章

订阅专栏

javascript

18 篇文章

订阅专栏

本文深入探讨JavaScript闭包的进阶应用，包括如何重写reduce函数，介绍柯里化函数的思想，以及分享两道相关的面试题目。通过实例解析，帮助读者理解闭包在预处理和存储信息方面的优势。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

闭包进阶应用（3）-重写 reduce；柯里化函数思想；两道面试题

let arr = [10, 20, 30, 40];
let result = reduce(arr, (result, item, index) => {
  return result + item;
})
console.log(result); // => 100
//如何重构 reduce 函数，达到此例效果？？？
function reduce(arr, callback, initvalue) {
  let result = initvalue,
    i = 0;
  if (typeof result === 'undefined') {
    i = 1;
    result = arr[0];
  }
  for (; i < arr.length; i++) {
    result = callback(result, arr[i], i);
  }
  return result
}

柯里化函数 => 预处理思想
- 执行函数，形成一个闭包，把一些信息存储起来
- 下级上下文调用闭包里的私有变量

let res = fn(1,2)(3);
console.log(res); //=>6  1+2+3

function fn() {
  let outerArray = Array.from(arguments);
  return function () {
    innerArray = Array.from(arguments);
    let arr = outerArray.concat(innerArray);
    let result = arr.reduce(function (result, item) {
      return result + item;
    })
    return result
  }
}

//ES6 可以简化此函数 
const fn1 = (...outerArray) => {
  return (...innerArray) => {
    return outerArray.concat(innerArray).reduce((result, item) => {
      return result + item
    })
  }
}
// 进一步简化箭头函数
const fn2 = (...outerArray) => ((...innerArray) => (outerArray.concat(innerArray).reduce((result, item) => (result + item))))