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

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

数组的reduce方法

reduce() 方法对数组中的每个元素按序执行一个由您提供的 reducer 函数，
每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。

第一次执行回调函数时，不存在“上一次的计算结果”。
如果需要回调函数从数组索引为 0 的元素开始执行，则需要传递初始值。
否则，数组索引为 0 的元素将被作为初始值 initialValue，
迭代器将从第二个元素开始执行（索引为 1 而不是 0）。

参数
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”回调函数遍历整个数组后的结果。

proxy实现链式编程

猜你喜欢