Pourquoi ce JavaScript OO est-il faux?

Question

Je mets mon code d'une manière simple, mais si une bonne âme veut aider le code est |on Github| /lib/inmotion/editor.js(line 99)

editor.js

function Editor(){ 
    var instance = this; 
    this.key_frames = [] // a list of key frames 
    this.kf = null // the current KeyFrame 

    function notice_click(click){ 
    instance.kf.add_bone(1) // <-- error here 
    // instance.kf.list.push(1) // <-- this works, but is incomplete 
    } 
} 

key_frame.js

function KeyFrame(){ 
    instance = this 
    instance.changed = false // for the redraw :) 
    instance.list = [] 

    function add_bone(bone){ 
    instance.list.push(bone) 
    instance.changed = true 
    return true 
    } 
} 

Mon programme a une instance de l'éditeur unique qui a beaucoup de cas de KeyFrames.
Chaque KeyFrame contient beaucoup d'os.
Donc il y a toujours un KeyFrame actif, défini par l'instance de Editor.kf
Comme je n'ai qu'un seul kf, je peux ajouter des os à celui-là sans problème, mais comme j'ajoute plus de KeyFrames je ne peux ajouter que add_bone au dernier kf j'ai créé! Pourquoi?

Si je n'étais pas assez clair, je présente mes excuses, demander le doute

Answer 1

Votre objet KeyFrame manque un var, il devrait ressembler à ceci:

function KeyFrame(){ 
    var instance = this; 
    instance.changed = false; 
    instance.list = []; 

    function add_bone(bone){ 
    instance.list.push(bone); 
    instance.changed = true; 
    return true; 
    } 
} 

Sans le mot-clé var vous définissez ou window.instance écraser, une variable globale , pas un local à l'objet comme vous voulez :)

Answer 2

Le problème, pour autant que je le comprends, est que « instance » est écrasée chaque fois que vous appelez KeyFrame. Vous devriez utiliser 'ceci' directement.