Javascript 从 1 个对象创建 2 个实例答案

【问题标题】：Javascript create 2 instances from 1 objectJavascript 从 1 个对象创建 2 个实例
【发布时间】：2012-11-11 21:24:36
【问题描述】：

我有两个 DIV 容器，每个容器都包含一个谜题（使用 jquery 可拖动实现）。

我还得到了一个看起来像这样的对象：

var puzzle var puzzle = {
    option1 = [],
    init:function(container) { .... }
}

要开始我使用的一个 DIV 的拼图：

// left puzzle div
var puzzleLeft = puzzle;
puzzleLeft.init(leftContainer);

// right puzzle div
var puzzleRight = puzzle;
puzzleRight.init(leftContainer);

但是对于左边的它不起作用。我要做的所有事情都发生在右侧：/当我取消注释右侧的起始代码时，它将适用于左侧:) 似乎是正确的一个开始代码是错误的？这是创建 2 个拼图实例的错误方法吗？

谢谢马特

【问题讨论】：

标签： javascript object javascript-objects

【解决方案1】：

你可以创建类的构造函数而不是对象：

function Puzzle(){
   var self = this;

   self.option1 = [];
   self.init = function(container) { .... };
}

并创建它的两个实例：

// left puzzle div
var puzzleLeft = new Puzzle();
puzzleLeft.init(leftContainer);

// right puzzle div
var puzzleRight = new Puzzle();
puzzleRight.init(rightContainer);

【讨论】：

如果管理功能在同一个命名空间中，它应该可以工作。

【解决方案2】：

其实puzzleLeft和puzzleRight和puzzle是同一个对象。

您可以将拼图创建为

function puzzle(){
...
}

并使用

new Puzzle()

或者使用jquery的clone函数来创建具有不同引用的对象的副本

【讨论】：

您有对象的 JQUERY 克隆示例吗？我只为元素找到它。谢谢

【解决方案3】：

原型继承

您的标题是“从 1 个对象创建 2 个实例”。上面写满了原型继承。

您可以使用Object.create 创建一个继承自另一个对象的对象。

// left puzzle div
var puzzleLeft = Object.create(puzzle);
puzzleLeft.init(leftContainer);

// right puzzle div
var puzzleRight = Object.create(puzzle);
puzzleRight.init(leftContainer);

但是，任何引用对象的属性都需要在 init 函数中设置。像这样的：

var puzzle = {

    // Let it be null for now
    option1: null,

    init: function(container) {
        // Set it to empty array inside init
        this.option1 = [ ];
    }

};

这将确保puzzleLeft 和puzzleRight 使用不同的数组。

克隆

如果您使用像 jQuery 这样的库，另一种选择是简单地克隆对象。

// left puzzle div
var puzzleLeft = $.extend({ }, puzzle);
puzzleLeft.init(leftContainer);

// right puzzle div
var puzzleRight = $extend({ }, puzzle);
puzzleRight.init(leftContainer);

使用$.extend({ }, someObject) 将复制someObject。

【讨论】：