es6 Proxy实现属性链式调用

微想未来

于 2022-10-20 15:54:01 发布

阅读量188

点赞数

分类专栏： js 文章标签： javascript

原文链接：https://es6.ruanyifeng.com

版权

js 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何使用ES6的reduce方法求数组之和，并通过Proxy实现属性链式调用，展示了JavaScript高级特性在实际编程中的应用。

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

//数组求和
var arrLearn = [1, 5, 9];
var sum = arrLearn.reduce(function (previousValue, currentValue) {
  console.log(previousValue, currentValue); //100 1 //101 5 //106 9
  return previousValue + currentValue;
}, 100);
console.log("数组求和", sum); //115

//实现属性链式调用
var double = (n) => n * 2;
var pow = (n) => n * n;
var reverseInt = (n) => n.toString().split("").reverse().join("") | 0;
var testObj = { double, pow, reverseInt };
var pipe = function (value) {
  var funcStack = [];
  var oproxy = new Proxy(
    {},
    {
      get: function (target, prop) {
        if (prop === "get") {
          return funcStack.reduce(function (val, fn) {
            console.log(val); // 3 6 36
            return fn(val);
          }, value);
        }
        funcStack.push(testObj[prop]);
        return oproxy;
      },
    }
  );
  return oproxy;
};

var result = pipe(3).double.pow.reverseInt.get;
console.log("属性链式调用", result); //63

示例来自：