美文网首页前端杂货铺
前端面试题--Reduce扩展

前端面试题--Reduce扩展

作者: loosenRogers | 来源:发表于2016-06-16 19:46 被阅读76次

最近做一个关于数组迭代方法reduce的扩展的题目,记录一下。第一次写简书,感觉棒棒哒!如有错误,欢迎指点斧正。

1、题目如下:

设计一个对数组的特殊reduce函数。它的参数表为:
  • 数组
  • 回调函数
  • 初始值(可选)
和普通的reduce的区别是回调函数callback接受n个参数,参数列表如下:
  • 上次计算的结果
  • 数组连续的k个元素(k<=m)
    例如:
var list = [1, 2, 3, ..., m];
var iter_a = function (sum, a, b) {
    return sum + a * b;
};
var iter_b = function (sum, a, b, c, d) {
    return sum + a / b / c / d;
};
reduce(list, iter_a, 17);
reduce(list, iter_b, 11);

最后得到的结果应该是:

iter_a: 17 + 1 * 2 + 2 * 3 + 3 * 4 + ... + (m - 1) * m
iter_b: 11 + 1 / 2 / 3 / 4 + 2 / 3 / 4 / 5 + ... + (m - 3) / (m - 2) / (m - 1) / m

2、解题过程

先去MDN看了下reduce,在polyfill部分找到解题思路。其中给出了普通reduce的实现方案。参考源码,再依据题目的具体需求进行修改便可得出我们所想要的扩展的reduce。

(1)和ECMAScript 5中reduce最大的区别是,这边传入的callback函数的参数是不定的

在不超出数组最大范围的情况下,callback函数参数个数可以是2~m+1个,所以我们必须要在reduce内部去获得callback的参数的个数

var count = callback.length;
(2)每次迭代的数组中k个连续元素

我们需要对迭代循环和callback参数进行修改

for(;k<len-count+2;k++){
    args.push(value);//第一个参数的回调值
    for(var i=0;i<count-1;i++){
        args.push(array[k+i]);
    }
    if(k in array){
        value = callback.apply(this,args);//通过apply将参数数组装入callback
    }
    args.length = 0;//参数数组清空,来存放下次迭代所需参数
}

3、reduce扩展代码

function Reduce(array,callback,initalValue){
        var len = array.length,
            k = 0,
            value = 0;
        if(arguments.length == 3){
            value = arguments[2];
        }
        else{
             while (k < len && !(k in array)) {
                k++; 
              }
              if (k >= len) {
                throw new TypeError('Reduce of empty array with no initial value');
              }
              value = array[k++];
        }
        var count = callback.length;
        var args = [];

        for(;k<len-count+2;k++){
            args.push(value);//第一个参数的回调值
            for(var i=0;i<count-1;i++){
                args.push(array[k+i]);
            }
            if(k in array){
                value = callback.apply(this,args);//通过apply将参数数组装入callback
            }
            args.length = 0;//参数数组清空,来存放下次迭代所需参数
        }
        return value;
    }

4、参考资料

(1)reduce in MDN
(2)《Javascript高级程序设计(第3版)》

相关文章

  • 前端面试题--Reduce扩展

    最近做一个关于数组迭代方法reduce的扩展的题目,记录一下。第一次写简书,感觉棒棒哒!如有错误,欢迎指点斧正。 ...

  • reduce函数的用法

    这是一个考察面试者对reduce函数用途的js面试题。下面我们看一下reduce函数的函数介绍: reduce()...

  • PHPer 面试指南-扩展阅读资源整理

    前端篇 收集的前端面试题和答案 前端开发面试题 史上最全的web前端面试题汇总及答案 前端工程师手册 HTTP协议...

  • PHPer 面试指南-扩展阅读资源整理

    前端篇 收集的前端面试题和答案 前端开发面试题 史上最全的web前端面试题汇总及答案 前端工程师手册 HTTP协议...

  • 值得看的前端面试文章- 收藏集 - 掘金

    【前端面试 -- 四月二十家前端面试题分享】1-5 套个人解题答案 - 前端 - 掘金前端面试题 前端面试--四月...

  • 总结前端问题

    前端经典面试题: 1、(前端面试题)https://zhuanlan.zhihu.com/p/84212558?f...

  • web前端面试题总结

    web前端试题集 WEB前端面试题

  • 笔试11

    摘自:* markyun 2014年最新前端开发面试题 和 前端开发面试题 darcyclarke Front...

  • 数组各种

    两个面试题 实现一个reduce函数,作用和原生的reduce类似下面的例子。 实现一个flatten函数,将一个...

  • 前端面试比较好的文章

    1、前端开发面试题2、vue面试题总汇

网友评论

    本文标题:前端面试题--Reduce扩展

    本文链接:https://www.haomeiwen.com/subject/bmsmdttx.html