2012-02-14 85 views
4

我试图做到以下几点参考:克隆对象和内部功能

var element = {}; 
element.attrA = 'A'; 
element.attrB = 1; 
element.autoAdvance = function(){ 
    var that = this; 
    setInterval(function(){ 
    that.attrB++; 
    },100); 
} 
element.instance = function(){ 
    var clone = $.extend(true, {}, this); 
    return clone; 
} 

现在,我可以做以下就好:

var e1 = element.instance(); 
var e2 = element.instance(); 
e1.attrA = 'not e2s business'; 
e2.attrA = 'not e1s attrA'; 

,当我尝试使用autoAdvance麻烦的开始:

e1.autoAdvance(); 

将启动所有克隆的“实例”element的autoAdvance。我相信这可能是相当微不足道的,但我不知道如何引用我的autoAdvance函数中的父对象,它的功能正确,并且只影响实例。谢谢!

编辑:

这是我使用的实际代码:

var player = {}; 
player.sprites = {}; 
player.sprites.back = ['img/playerback_01.png','img/playerback_02.png','img/playerback_03.png']; 
player.sprites.head = ['img/playerhead_01.png','img/playerhead_02.png','img/playerhead_03.png']; 
player.back = new Image(); 
player.back.src = player.sprites.back[0]; 
player.head = new Image(); 
player.head.src = player.sprites.head[0]; 
player.loop = function(){ 
    var that = this; 
    var loop = setInterval(function(){ 
      //remove the [0] state from the sprite array and add it at [2] 
     var state = that.sprites.head.shift(); 
     that.sprites.head.push(state); 
     state = that.sprites.back.shift(); 
     that.sprites.back.push(state); 
     that.back.src = that.sprites.back[0]; 
     that.head.src = that.sprites.head[0]; 
     }, 100); 
} 
player.x = 0; 
player.y = 0; 
player.instance = function(){ 
    var clone = $.extend(true, {}, this); 
    return clone; 
} 

我产生两名球员:

var player1 = player.instance(); 
var player2 = player.instance(); 

但正在发生的事情是,当我使用:

player1.loop(); 

player2的动画也将开始播放。

+0

看起来不错。证明:http://jsfiddle.net/Q45ft/这个指的是什么取决于函数的调用方式。当你将它称为'e1.autoAdvance()'时,'this'将引用'autoAdvance'中的'e1',并且不会影响任何其他对象。 – 2012-02-14 12:24:28

+0

嗯,我的'实际'代码稍微复杂一些,但我会将其添加到问题中。 – m90 2012-02-14 12:27:20

+1

我假定''.extend'不知道如何克隆'back'和'head'对象(因为它们是'Image's,扩展只能和数组和对象一起工作([source](https:// github.com/jquery/jquery/blob/master/src/core.js#L303)))。我只是使用一个构造函数并使用该函数创建实例。 – 2012-02-14 12:35:55

回答

0

我建议你在JavaScript中开始使用“class”。它们或多或少是一种功能。

function Player(){ 
this.sprites={}; 
...... 
} 
Player.prototype.loop=function(){ 
.... 
} 
var player1=new Player(); 
var player2=new Player(); 
player1.loop(); 
player2.loop();// this should work better 

它并没有真正回答你的问题,但它是一种更清洁和更好的方式编写代码的替代方法。

+0

刚刚看到你的答案,因为费利克斯已经在我的问题的评论中提出了这个建议。这正是我最终的结果。感谢提示。 – m90 2012-02-20 10:24:25