Object.defineProperty get/set closure

Question

Ok, j'essaie de créer un nouvel objet de cette manière :

var src = {a:'a', b:'b', c:'c'};
var out = {};
for(var prop in src){   
    Object.defineProperty(out, prop,{
        get: function(){
            return src[prop];
        },
        set: function(val){
            src[prop]=val;
        }
    })
}

Et obtenir un mauvais résultat :

out = {a:'c', b:'c', c:'c'}

Je connais d'autres façons de créer cet objet, par exemple :

for (var prop in src) {
    (function(prop) {
        Object.defineProperty(out, prop, {
            get: function() {
                return src[prop];
            },
            set: function(val) {
                src[prop] = val;
            }
        })
    })(prop)
}

ou :

Object.keys(src).map(function(prop){
    Object.defineProperty(out, prop,{
        get: function(){
            return src[prop];
        },
        set: function(val){
            src[prop]=val;
        }
    })
})

Mais je ne comprends pas pourquoi, dans la première méthode, un paramètre de type chaîne "prop" sera envoyé à la fonction "defineProperty" par un lien. Aidez-moi à comprendre cela s'il vous plaît. Désolé pour le mauvais anglais.

Answer 1

Lorsque vous créez une fonction à l'intérieur d'une boucle, vous créez une fermeture autour des variables utilisées dans cette boucle. Dans ce cas, il y a une fermeture autour de prop . Chaque fonction (les "getters") a une référence à prop de sorte que lorsqu'ils sont appelés par la suite (lorsque le getter est utilisé), ils utilisent la valeur contenue dans prop qui se trouve être la dernière valeur attribuée dans la boucle.

En d'autres termes, étant donné que le getter est appelé plus tard, la valeur dans prop est la dernière valeur qui lui a été attribuée. defineProperty en revanche, obtient la bonne valeur puisqu'il n'y a pas de fermeture. Elle est appelée avec la valeur au moment de l'appel plutôt qu'après la fin de la boucle.