为什么我的 JavaScript 实例返回相同的内容

Why does my JavaScript instances return the same?

本文关键字：返回 我的 JavaScript 实例 为什么      更新时间：2023-09-26

我正在尝试创建一个名为myObjectConstructor的函数变量的两个实例(constructorOne和constructorTwo(。出于某种原因，当我调用getProperty时，我为两个实例返回相同的结果。

//this is one other way of creating a Constructor function
var myObjectConstructor = function(){
    this.myProperty = '';
    init = function(str) {
       this.myProperty = str;
    },
    getProperty = function() {
       return this.myProperty;
    }     
    return {
        init: function () {
            return init.apply(self, arguments);
        },
        getProperty: function () {
            return getProperty.apply(self, arguments);
        }
    }
}
//instantiate our Constructor
var constructorOne = new myObjectConstructor();
//change myProperty of the first instance
constructorOne.init('this is property one');
//instantiate a second instance of our Constructor
var constructorTwo = new myObjectConstructor();
constructorTwo.init('this is property two');

constructorOne.getProperty()和constructorTwo.getProperty()都会提醒">这是属性二"：

alert(constructorOne.getProperty()); //this will alert 'this is property two'
alert(constructorTwo.getProperty()); //this will still alert 'this is property two'

这是一个演示。

问题是，为什么constructorOne.getProperty()不返回"这是财产一"？

self undefined，所以在init函数中，this是window的，所以你总是在修改同一对象的属性。

您似乎正在做一些模块模式和标准JavaScript构造函数的奇怪混合。我强烈建议选择两种方法中的一种并坚持下去。

function MyObjectConstructor(){
    this.myProperty = '';
}
MyObjectConstructor.prototype.init = function(str) {
       this.myProperty = str;
};
MyObjectConstructor.prototype.getProperty = function() {
       return this.myProperty;
};
 
//instantiate our Constructor
var constructorOne = new MyObjectConstructor();
 
//change myProperty of the first instance
constructorOne.init('this is property one');
 
//instantiate a second instance of our Constructor
var constructorTwo = new MyObjectConstructor();
 
constructorTwo.init('this is property two');
//alert current myProperty of constructorOne instance
alert(constructorOne.getProperty()); 
 //alert current myProperty of constructorTwo instance
alert(constructorTwo.getProperty());

或

function myModule (){
  var myProperty = '';
  return {
    init: function (str) {
       myProperty = str;
    },
    getProperty: function () {
      return myProperty;
    }
  };  
}
//instantiate our Constructor
var constructorOne = myModule();
 
//change myProperty of the first instance
constructorOne.init('this is property one');
 
//instantiate a second instance of our Constructor
var constructorTwo = myModule();
 
constructorTwo.init('this is property two');
//alert current myProperty of constructorOne instance
alert(constructorOne.getProperty()); 
 //alert current myProperty of constructorTwo instance
alert(constructorTwo.getProperty());

更好的方法是使用适当的原型：

function MyObjectConstructor() {
    this.property = '';
}
MyObjectConstructor.prototype.init = function(newProperty) {
    this.property = newProperty;
};
MyObjectConstructor.prototype.getProperty = function() {
    return this.property;
};
相关文章：