javascript - JS 无法从不同的函数访问对象值

Question

谁能解释为什么第一个有效而第二个无效？

function MyObj(val) {
    this.value = val;

    this.myFunc = function(selector) {
        $(selector).html("test: " + this.value);
    }
}

foo = new MyObj("tester");
foo.myFunc("#one"); //This works

func = foo.myFunc;
func("#two"); //This doesnt

如何？我怎样才能让它发挥作用？

JSFIDDLE

Answer 1

JavaScript 中函数的 this 并不固定为任何东西；当你打电话时

something.somefunc()
// or something['somefunc']()

this 绑定(bind)到 something。当您在没有对象的情况下调用函数时，this 会绑定(bind)到 undefined(在严格模式下)或全局对象。

您可以通过保留一个变量来保存正确的 this 来绕过它:

function MyObj(val) {
    var obj = this;

    this.value = val;

    this.myFunc = function(selector) {
        $(selector).html("test: " + obj.value);
    };
}

ECMAScript 5 在 Function.prototype 上提供了一个方法来专门处理这个问题(你通常应该把 myFunc 放在 MyObj.prototype 上，也是):

var func = foo.myFunc.bind(foo);
func("#two"); // Works now