• proxy实现链式编程


    利用 Proxy,可以将读取属性的操作(get),转变为执行某个函数,从而实现属性的链式操作。
    设置 Proxy 以后,达到了将函数名链式使用的效果

    var pipe = function (value) {
      var funcStack = [];
      var oproxy = new Proxy({} , {
        get : function (pipeObject, fnName) {
          if (fnName === 'get') {
            return funcStack.reduce(function (val, fn) {
              return fn(val);
            },value);
          }
          funcStack.push(window[fnName]);
          return oproxy;
        }
      });
    
      return oproxy;
    }
    
    var double = n => n * 2;
    var pow    = n => n * n;
    var reverseInt = n => n.toString().split("").reverse().join("") | 0;
    
    pipe(3).double.pow.reverseInt.get; // 63
    console.log(pipe(3).double.pow.reverseInt.get) // 63
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23

    经过打断点,在控制台看执行过程:
    执行过程是从左到右的;
    上述函数执行过程,value为3会一直在,并不会被销毁(不足为奇哈)。
    proxy在pipe(3):生成一个proxy并且将其返回后,后续的属性操作都走proxy的handler了

    数组的reduce方法

    reduce() 方法对数组中的每个元素按序执行一个由您提供的 reducer 函数,
    每一次运行 reducer 会将先前元素的计算结果作为参数传入,最后将其结果汇总为单个返回值。
    
    第一次执行回调函数时,不存在“上一次的计算结果”。
    如果需要回调函数从数组索引为 0 的元素开始执行,则需要传递初始值。
    否则,数组索引为 0 的元素将被作为初始值 initialValue,
    迭代器将从第二个元素开始执行(索引为 1 而不是 0)。
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7

    参数
    callbackFn
    一个“reducer”函数,包含四个参数:

    • previousValue:上一次调用 callbackFn 时的返回值。在第一次调用时,若指定了初始值 initialValue,其值则为 initialValue,否则为数组索引为 0 的元素 array[0]。
    • currentValue:数组中正在处理的元素。在第一次调用时,若指定了初始值 initialValue,其值则为数组索引为 0 的元素 array[0],否则为 array[1]。
    • currentIndex:数组中正在处理的元素的索引。若指定了初始值 initialValue,则起始索引号为 0,否则从索引 1 起始。
    • array:用于遍历的数组。

    initialValue 可选

    • 作为第一次调用 callback 函数时参数 previousValue 的值。若指定了初始值 initialValue,则 currentValue 则将使用数组第一个元素;否则 previousValue 将使用数组第一个元素,而 currentValue 将使用数组第二个元素。

    返回值
    使用“reducer”回调函数遍历整个数组后的结果。

  • 相关阅读:
    设计模式(六)代理模式
    Flutter:statelessWidget案例、StatefulWidget案例
    从handle得到GraphicBuffer
    Electron开发环境准备
    Linux操作系统的基础指令
    力扣:1854. 人口最多的年份
    MongoDB内部的存储原理
    CAS:198139-51-4,OG 488 SE,OG 488-NHS,俄勒冈州绿488琥珀酰亚胺酯
    基于MxNet实现目标检测-CenterNet【附部分源码及模型】
    【Python爬虫三天从0到1】Day1:爬虫核心
  • 原文地址:https://blog.csdn.net/weixin_43131046/article/details/128189759