Question

我创建了一个新变量carBasket和foodBasket，并将它们设置为等于basketModule()函数。然而，当我希望这两个变量中的每一个都指向它们自己的函数时，它们指向相同的函数。我想知道我应该做些什么来实现这个目标？

var basketModule = (function() {
    var basket = [];
    return {
        addItem: function(values) {
            basket.push(values);
        },
        getItemCount: function() {
            return basket.length;
        }
    };
}());

carBasket = basketModule;
carBasket.addItem('Audi');

foodBasket = basketModule;
foodBasket.addItem('Ham');

foodBasket.getItemCount(); //outputs 2 instead of 1

Answer 1

您必须为每个对象调用一个函数，以便为每个对象生成不同的变量，例如：

var basketModule = function() {
  var basket = [];
  return {
    addItem: function(values) {
      basket.push(values);
    },
    getItemCount: function() {
      return basket.length;
    }
  };
};
var carBasket = basketModule(),
    foodBasket = basketModule();
carBasket.addItem('Audi');
foodBasket.addItem('Ham');
foodBasket.getItemCount(); // 1

但是，为了重用所有实例的方法，最好使用构造函数：

var BasketModule = function() {
  this.basket = [];
};
BasketModule.prototype.addItem = function(values) {
  this.basket.push(values);
};
BasketModule.prototype.getItemCount = function() {
  return this.basket.length;
};
var carBasket = new BasketModule(),
    foodBasket = new BasketModule();
carBasket.addItem('Audi');
foodBasket.addItem('Ham');
foodBasket.getItemCount(); // 1

Answer 2

您应该考虑尝试使用此模式：

var BasketModule = function() {
    var basket = [];
    return {
        addItem: function(values) {
            basket.push(values);
        },
        getItemCount: function() {
            return basket.length;
        }
    };
};

carBasket = new BasketModule();
carBasket.addItem('Audi');

foodBasket = new BasketModule();
foodBasket.addItem('Ham');

jsfiddle：https://jsfiddle.net/nvsbjset/

这将为每个basket

创建单独的对象

指向相同功能的变量

2 个答案: