将自定义JavaScript函数添加到方法调用链中的本地方式

前端之家收集整理的这篇文章主要介绍了将自定义JavaScript函数添加到方法调用链中的本地方式前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想知道,如果有一种本机的做法:
Object.prototype.chain = function(f) { return f.call(this) }


function fun1() {
    doSomethingWithObject(this)
    return this
}

function fun2() {
    doSomethingElse(this)
    return this
}

someObject
    .method1('something')
    .method2()
    .chain(checkSomething() ? fun1 : fun2)
    .method3()

但是我不想改变Object的原型.有没有办法这样做,而不修改对象或其他构造函数的原型,我使用(而不是开发人员)

编辑:

我觉得我的解释不好,所以让我们加一些细节:

我想做的是使用一些我没有定义的API. someObject被定义如下,具有可链接方法

var someObject = {
    method1: function(val) {
        // do something
        return this
    },method2: function() {
        // do something
        return this
    },method3: function() {
        // do something
        return this
    }
}

现在想象我不能改变这个代码,因为这个对象是从一个库,所以我不想.然后,想象我想链接方法和一些自定义函数(请参阅我的第一个代码段)为更多的不同的对象.最简单的做法是将一个链接方法附加到Object.prototype.

但我认为这可能会导致未来的冲突.我正在寻找一种方式来做同样的事情,而不用触摸原型.

解决方法

包装器将包装任何对象以使其与“链接”兼容,并将添加另一种链接方法,这将允许您插入外部函数并仍然获取链接.

检查这个例子:

function myObj() {
    this.state = {
        a: 1
    };
    this.method1 = function () {
        console.log("1");
    }
    this.method2 = function () {
        console.log("2");
    }
    this.method3 = function () {
        console.log("3");
    }
    this.method4 = function () {
        console.log(this.state);
    }
}

function objectChainWrapper(obj) {
    this.chain = function (fn) {
        fn.call(obj);
        return this;
    }

    for (var prop in obj) {
        if (obj.hasOwnProperty(prop) && typeof obj[prop] == 'function') {
            this[prop] = (function (methodName) {
                return function () {
                    obj[methodName].call(obj);
                    return this;
                }
            }(prop))
        }
    }
}

var obj = new myObj();
var wrapper = new objectChainWrapper(obj);
var chainMethod = function(){ console.log('chain') };
var chainMethodState = function(){ console.log(this.state) };
wrapper.method1().method2().chain(chainMethodState).method3().chain(chainMethod).method4();

JSFIDDLE.

原文链接:https://www.f2er.com/js/155287.html

猜你在找的JavaScript相关文章