JavaScript accesso genitore attributo dell'oggetto

Question

Ho un piccolo problema in JS, ho due oggetti nidificati, e vorrei accedere a una variabile dal genitore, in questo modo:

var parent = { 
    a : 5, 

    child: { 
     b : 3, 
     displayA : function(){ 
      console.log(this.a); 
      //undefined 
      }, 

     displayB : function(){ 
      console.log(this.b); 
      //displays 3 
      } 
     } 
} 

E vorrei solo per sapere come rendere genitore.child.displayA lavoro :) (Ho sotto-oggetti che hanno bisogno di accedere alla variabile di un genitore)

Qualsiasi aiuto apprezzato Grazie mille!

Answer 1

È possibile utilizzare call per impostare il valore di this:

parent.child.displayA.call(parent); // 5 

Potreste anche essere interessati a binding esso:

parent.child.displayA = function(){ 
    console.log(this.a); 
}.bind(parent); 
parent.child.displayA(); // 5 

Oppure si si può semplicemente utilizzare parent invece di this:

parent.child.displayA = function(){ 
    console.log(parent.a); 
}; 
parent.child.displayA(); // 5 

Answer 2

Javascript è prototype based, non è un normale linguaggio OOP come PHP o Java.

Dai uno sguardo allo Inheritance and the prototype chain e implementa qualcosa come Simple Javascript inheritance.

Probabilmente si potrebbe accedere al genitore tramite window.parent se è nell'ambito globale, ma l'esempio non funzionerà in ogni caso.

Answer 3

Non esiste un modo generale per l'oggetto child di sapere che si tratta di un membro dell'oggetto padre. Nella tua situazione, è possibile fare un riferimento diretto all'oggetto padre nella displayA(), in questo modo:

displayA : function(){ 
    console.log(parent.a); 
} 

Non c'è bisogno di mettere padre nella portata globale e l'uso window.parent come suggerisce un'altra risposta; poiché stai dichiarando displayA nell'ambito di parent, la funzione verrà chiusa su parent e sarà accessibile ovunque entro child. Poiché la chiusura contiene un riferimento all'oggetto parent, le modifiche a parent si rifletteranno nel comportamento di displayA. Ad esempio, supponiamo che parent e child siano definiti come nell'esempio, ad eccezione di displayA modificato per utilizzare parent.a. Poi:

parent.child.displayA(); //=> 5 
parent.a = 10; 
parent.child.displayA(); //=> 10 

Tutto ciò premesso, se si sta cercando di imitare OOP, poi l'altra risposta è giusta: si dovrebbe leggere di più su come funziona il prototipo catena Javascript.

Answer 4

Penso che non abbia davvero senso farlo in questo modo poiché è possibile accedere all'oggetto figlio solo tramite il relativo genitore. quindi perché aggiungere un elemento displayB al figlio mentre puoi aggiungerlo al genitore che ha accesso a tutte le proprietà figlio.

Answer 5

Nel tuo esempio non hai ereditarietà. Si può fare questo

... 
    displayA : function(){ 
     console.log(parent.a); 
     // 5 
    }, 
... 
parent.child.parent = parent; 
parent.child.displayA(); 

Answer 6

È possibile utilizzare super.prop per accedere alle proprietà della classe genitore. Naturalmente, solo se si utilizza ES6.