在继承的函数中访问 $this

Question

我无法弄清楚这里发生了什么。 我知道你必须时不时地将“this”显式绑定到一个函数才能访问它

myclass: {
    test: function(){
        console.log(this.property);
    }.bind(this);
}

我有两个对象father 和child，我将它们扩展为合并所有属性。我将 $.extend 与“true”一起使用，以获得深层副本并使用全新的对象，以免修改原始对象。

var father = {

    mydata: {
        age: 49
    },

    mymethods: {
        showMyAge: function() {
            console.log(this.mydata.age);
        }
    }
};

var child = {
};

var obj = $.extend(true, {}, father, child);

obj.mymethods.showMyAge();

输出是

Uncaught TypeError: Cannot read property 'age' of undefined

好的，我说。这是绑定（这个）的东西。非常简单。 所以，我尝试添加 bind(this)

var father = {

     /*...*/

    mymethods: {
        showMyAge: function() {
            console.log(this.mydata.age);
        }.bind(this)
    }
};

再次

Uncaught TypeError: Cannot read property 'age' of undefined

我试过了

obj.mymethods.showMyAge().bind(obj);

同样的错误。 然后我发现，如果我把父亲的方法平了一层就行了！

var father = {

    /*...*/

    mymethods: {
        /* moved showMyAge method from here ... */
    }

    /* to here */
    showMyAge: function() {
        console.log(this.mydata.age);
    }
};

输出正确

49

为什么会这样？当然，这对我来说不是解决方案，因为我有一个非常复杂的对象，其中包含子对象，包含方法。

提前谢谢你。

Answer 1

这样使用： obj.mymethods.showMyAge.call(obj); 或 obj.mymethods.showMyAge.apply(obj);

apply 使用参数作为数组：yourFunction.apply(valueForThis, arrayOfArgs);

call 要求列出参数：yourFunction.call(valueForThis, arg1, arg2, ...,argN);

Answer 2

将您的对象包装在 IIFE（立即调用函数表达式）中。这会在闭包中创建一个私有变量 (that)。然后你可以引用that 作为你的父对象。

var father = (function() {
  var that = {
    mydata: {
        age: 49
    },

    mymethods: {
        showMyAge: function() {
            console.log(that.mydata.age);
        }
    }
  };
  return that;
})();