Come posso adattare correttamente questo metodo "pubblico"?

Question

Ho questo codice (JSFiddle)

var OBJ = function(){ 
    var privateVar = 23; 
    var self = this; 

    return { 
     thePrivateVar : function() { 
      return privateVar; 
     }, 

     thePrivateVarTimeout : function() { 
      setTimeout(function() { alert(self.thePrivateVar()); } , 10); 
     } 
    } 

}(); 

alert(OBJ.thePrivateVar()); 

OBJ.thePrivateVarTimeout(); 

Questa è un'astrazione di un vero problema che sto avendo.

Così - mi si aspetterebbe la chiamata a OBJ.thePrivateVarTimeout() aspettare 10 e poi alert con 23 (che voglio che l'accesso attraverso l'altro metodo esposto).

Tuttavia, l'impostazione self non sembra essere impostata correttamente. Quando sto impostando self = this sembra che this non sia un riferimento alla funzione ma un riferimento all'oggetto globale. Perchè è questo?

Come è possibile impostare il metodo pubblico thePrivateVarTimeout l'altro metodo pubblico thePrivateVar?

Answer 1

var OBJ = (function(){ 
    var privateVar = 23; 
    var self = { 
     thePrivateVar : function() { 
      return privateVar; 
     }, 

     thePrivateVarTimeout : function() { 
      setTimeout(function() { alert(self.thePrivateVar); } , 10); 
     } 
    }; 

    return self; 

}()); 

this === global || undefined all'interno di una funzione chiamata. In ES5 è qualunque sia l'ambiente globale, in ES5 rigoroso non è definito.

modelli più comuni comporterebbe utilizzando il var that = this come valore locale in una funzione di

var obj = (function() { 
    var obj = { 
    property: "foobar", 
    timeout: function _timeout() { 
     var that = this; 
     setTimeout(alertData, 10); 

     function alertData() { 
     alert(that.property); 
     } 
    } 
    } 

    return obj; 
}()); 

o utilizzando un metodo .bindAll

var obj = (function() { 
    var obj = { 
    alertData: function _alertData() { 
     alert(this.property); 
    } 
    property: "foobar", 
    timeout: function _timeout() { 
     setTimeout(this.alertData, 10); 
    } 
    } 

    bindAll(obj) 

    return obj; 
}()); 


/* 
    bindAll binds all methods to have their context set to the object 

    @param Object obj - the object to bind methods on 
    @param Array methods - optional whitelist of methods to bind 

    @return Object - the bound object 
*/ 
function bindAll(obj, whitelist) { 
    var keys = Object.keys(obj).filter(stripNonMethods); 

    (whitelist || keys).forEach(bindMethod); 

    function stripNonMethods(name) { 
     return typeof obj[name] === "function"; 
    } 

    function bindMethod(name) { 
     obj[name] = obj[name].bind(obj); 
    } 

    return obj; 
}