call() 不适用于从函数构造函数创建的对象

Question

我在 JS 中创建了一个名为 House 的构造函数。

function House(color, floor, location){
    this.color = color;
    this.floor = floor;
    this.location = location;    
}

使用这个原型我又创建了两个对象，分别命名为 myHouse 和 myOldHouse。

var myHouse = new House('brick red', '1st floor', 'saltlake');
var myOldHouse = new House('Yellow', '2st floor', 'Koikhali');

然后我向 myHouse 对象添加了一个名为 address 的新方法。

myHouse.address = function(address){
   this.address = address;
   console.log('My address is '+this.address); 
}

现在我想使用调用函数将此方法添加到 myOldHouse 对象。

myHouse.address.call(myOldHouse, '2G');

但是当我调用 myOldHouse.address() 时，它显示错误。

Answer 1

我喜欢你的方法，这是传统方法。请使用 setAddress 或类似的东西。

错误： - 您不能在同一级别上使用同名的方法和变量。调用您的 setter 函数 setAddress。 - 不要在对象（class 的实例）上附加新方法，直接在 class 上执行。试试这个：

function House(color, floor, location) {
   
    this.color = color;
    this.floor = floor;
    this.location = location;    
    this.address = "";
}

Address = function( color, floor, location , address) {
   House.call(this, color, floor, location);
   this.address = address;
   console.log('My address is '+this.address + " color is: ", this.color); 
};

var myHouse = new Address('brick red', '1st floor', 'saltlake', "country1");
var myOldHouse = new Address('Yellow', '2st floor', 'Koikhali', "country2");

// myHouse.setAddress ('new address');

class 这种定义方式并不奇怪或愚蠢。你总是可以把你 class 放在一个文件中，以确保一切都清楚。

传统 class 定义将防止旧版本浏览器出现任何错误，并且仍然适用于所有现代网络导航器。

Answer 2

Call 在方法中调用时（在您的情况下为 address ）只是告诉范围该方法应该运行。传递 myOldHouse 时，在地址方法中 this关键字指的是myOldHouse对象。所以现在 myOldHouse.address 必须打印出 '2G'。在您的情况下，您正在访问此处对象无法访问的方法。根本原因是方法 address 没有在两个对象之间共享，即 myHouse 和 myOldHouse。您已经从 House 函数创建了这些对象，这意味着这两个对象将可以访问与 House 关联的所有属性。在您的示例中，您已将 address 方法与 myHouse 相关联，这限制了它可以访问从 myHouse 函数创建的对象。

例如：

var myHouseChild = new myHouse(...);

现在，myHouseChild 对象将可以访问 House 和 myHouse 函数的属性。

为了使 address 方法适用于 myOldHouse，您必须在 House 函数的原型中设置它，以便它在它的对象之间共享。

喜欢，House.prototype.address = () => {};

请参阅 this 答案以了解 new 关键字的内部工作原理。

call() 不适用于从函数构造函数创建的对象

call() not working for object created from function contructor

javascript

constructor

prototype

object

call