Question

当我尝试在另一个构造函数中创建新的构造函数对象时，我在创建对象时无法使用this.time。但我可以在方法中使用this.time并返回值。怎么会这样？！

当我运行第二个console.log时，我只得到undefined。这是关于这一行：timeControl: new TimeControl(this.time)如果我使用类似33的值，它可以正常工作，但不能使用this.time感兴趣并且好奇为什么代码会像这样？

（为了最小化此问题中的代码，我没有显示TimeControl构造函数）

    // Box
Box = function(x,y,value) {
    this.x = x;
    this.y = y;
    this.time = value;
    // Create a new object of TimeControl
    //this.timeControl = new TimeControl(this.time); // OK to create object here!
}
Box.prototype = {
    // Create a new object of TimeControl
    timeControl: new TimeControl(this.time), // But not OK here! Works if I enter a number
    test1: function() {
        return this.time;
    },
    test2: function() {
        return this.timeControl.getTime();
    }
};

var box = new Box(10,10,14);
console.log("Duration: " + box.test1()); // Works fine
console.log("Duration: " + box.test2()); // Returns undefined if this.time is used

Answer 1

将timeControl更改为函数，然后从中返回新的TimeControl，因为原型this内部持有window对象的引用。

TimeControl = function(time){
this.time=time;
    console.log('time control initialized time is ='+this.time);
}
TimeControl.prototype = {
    getTime:function(){
    return this.time;
    }
}
Box = function(x,y,value) {
    this.x = x;
    this.y = y;
    this.time = value;
    // Create a new object of TimeControl
    //this.timeControl = new TimeControl(this.time); // OK to create object here!
}
Box.prototype = {
    xyz:this.time,//here this.time is undefined as this is holding ref of window object
     // Create a new object of TimeControl
    timeControl:function(){return  new TimeControl(this.time)}, // But not OK here! Works if I enter a number
    test1: function() {
        return this.time;
    },
    test2: function() {
        return this.timeControl().getTime();
    }
};

var box = new Box(10,10,14);
console.log("Duration: " + box.test1()); // Works fine
console.log("Duration: " + box.test2()); // Returns undefined
console.log("xyz: " + box.xyz);

http://jsfiddle.net/vikrant47/df6bgk8L/2/

Answer 2

在像timeControl: new TimeControl(this.time)这样的对象属性中定义函数时，此函数会立即调用。因此this将是window。解决方案 - 使用匿名函数：

BoxPrototype: {
    timeControl: function() {
        return new TimeControl(this.time);
    }
}

或构造函数中的初始化TimeControl：

Box = function(x, y, value) {
    this.time = new TimeControl(value);
}

Box.prototype = {
    getTimeControl: function() {
        return this.time;
    }
}

Answer 3

理解为什么＆＃34; this＆＃34;不起作用，您必须了解this和scopes在javascript中的工作方式。在javascript中，您只有两个范围，全局范围和函数范围。

使用new运算符创建对象时，实质上是将新对象的上下文设置为this。因此this将指向新对象。此外，函数也有自己的作用域第一个代码有效。

使用object literal（第二个代码段）创建对象时。关键字this将指向全局对象（取决于上下文）。既然您在全局对象中没有名为time的属性，则this.time不起作用。对象文字是javascript表达式，他们不会自己创建一个范围。范围取决于他们的生活地点。

我会在这些行上修改原型对象

Box.prototype = ({
  timeControl: null,
  test1: function() {
    return this.time;
  },
  test2: function() {
    return this.timeControl.getTime();
  },
  setTimeCtrl: function() {
    //set the timecontrol object here
    this.timeControl = new TimeControl(this.time);
    return this;// return the newly created object
  }
}).setTimeCtrl(); //invoke it as soon as you create the object

这确保创建对象，然后设置必要的属性

为什么物业价值与这个＆＃39;不在构造函数对象中工作？

3 个答案: