Question

我以为我理解了javascript原型对象以及如何使用它，但现在我遇到了让我有点难过的东西。尝试运行mpo.testFire()下面的代码时没有问题，但是我收到错误Uncaught TypeError：Object＃在尝试调用mpo.fireAlert()时没有方法'fireAlert'，我认为它是原型的一部分：

<body>
     <a href="#" id="testBtn">Click Me</a>
</body>

// Click handler, create new object
// call parent method and prototype method
$("#testBtn").click(function(e) {
   e.preventDefault();
   var mpo = new Myobject();
   mpo.testFire();
   mpo.fireAlert();
});

Myobject = function () {
    var testFire = function () {
        alert('testFire');
    };

    return {
        testFire:testFire
    };
};

Myobject.prototype = function() {
    var fireAlert = function() {
         alert('made it to fireAlert');   
    };

    return {
        fireAlert:fireAlert
    };
}();

如果我更改代码并将所有内容移动到对象的原型，就像下面的代码一样，一切都按预期工作：

 $("#testBtn").click(function(e) {
   e.preventDefault();
   var mpo = new Myobject();
   mpo.testFire();
   mpo.fireAlert();
});

Myobject = function () {
    // constructor logic here maybe?
};

Myobject.prototype = function() {
    var fireAlert = function() {
         alert('made it to fireAlert');   
    };

    var testFire = function () {
        alert('testFire');
    };

    return {
        fireAlert:fireAlert,
        testFire:testFire
    };
}();

我猜测存在范围问题，因为在第一个示例中，我从父对象返回一个接口。谁能解释为什么第一个例子不起作用？

Answer 1

您正在从MyObject构造函数的第一个实现返回一个对象文字，它对MyObject所属的原型链一无所知。在第二个实现中，空构造函数返回创建的新上下文，实际上是一个知道相应原型链的MyObject对象

Answer 2

你正在返回一个对象文字

return {
    testFire:testFire
};

“覆盖”new的结果（因为它是一个对象。例如，返回一个字符串文字会返回创建的对象。）

这是ES5 spec 13.2.2。

从父对象调用原型方法不起作用

2 个答案: