JavaScript: Zugang eigene Objekteigenschaft innerhalb Arrayliteral

Question

ein Arrayliteral in einem JavaScript-Objekt gegeben, hat seine eigenen Eigenschaften des Objekts Zugriff nicht zu funktionieren scheint:

var closure = { 

     myPic : document.getElementById('pic1'), 
     picArray: [this.myPic] 
}  

alert(closure.picArray[0]); // alerts [undefined] 

Während ein Array Artikel erklärt, durch einen anderen Zugriff JavaScript Object scheinen

​var closure1 = { 
​  
​  myPic : document.getElementById('pic1') 
​} 
​  
​var closure2 = { 
​ 
​  picArray: [closure1.myPic] 
​}  
​  
​alert(closure2.picArray[0]); // alerts [object HTMLDivElement] 

Beispiel zu arbeiten: http://jsfiddle.net/5pmDG/

Answer 1

Der Wert this funktioniert nicht so, er bezieht sich auf einen Wert, der vom tatsächlichen Ausführungskontext und nicht vom Objektliteral bestimmt wird.

Wenn Sie eine Funktion Mitglied des Objekts zum Beispiel erklären, könnten Sie das gewünschte Ergebnis erhalten:

var closure = { 
    myPic: document.getElementById('pic1'), 
    getPicArray: function() { 
    return [this.myPic]; 
    } 
}; 
//... 
closure.getPicArray(); 

Da der this Wert innerhalb der getPicArray Funktion, auf Ihr closure Objekt beziehen.

Siehe this answer zu einer anderen Frage, wo ich das Verhalten des Schlüsselwortes this erkläre.

Edit: Als Antwort auf Ihren Kommentar, in dem Beispiel, das ich zur Verfügung gestellt habe, wird die getPicArray Methode ein neues Array erzeugt jedes Mal Objekt sie aufgerufen wird, und da Sie das Array speichern wollen, sind und Änderungen vornehmen

var closure = { 
    myPic: document.getElementById('pic1') 
}; 
closure.picArray = [closure.myPic]; 

Dann können Sie ändern die closure.picArray Mitglied ohne Probleme: es, würde ich Sie so etwas wie dieses, bauen Sie Ihr Objekt in zwei Schritten empfehlen.

Answer 2

Die Eigenschaft this verweist nicht auf das Objekt closure. Wenn wir die Eigenschaft myPic im globalen Gültigkeitsbereich definieren würden, wird picArray mit diesem Wert initialisiert. Betrachten Sie folgendes Beispiel:

<script> 
window.myPic = "Global myPic"; 

var closure = { 
    myPic : document.getElementById('pic1'), 
    picArray: [this.myPic] // this refers to the global object 
}; 

console.log(closure.picArray); // ["Global myPic"]; 
</script> 

this eines der schwierigsten Konzepte in JavaScript ist. Sie könnten diese article zu diesem Thema mögen.