JavaScript Module Motif - Qu'en est-il en utilisant « retourner ce »?

Question

Après avoir fait un peu de lecture sur le modèle du module, je l'ai vu quelques façons de retourner les propriétés que vous voulez être public.

L'une des façons les plus communes est de déclarer vos biens publics et des méthodes à l'intérieur de la déclaration « retour », en dehors de vos propriétés privées et les méthodes. Une façon similaire (le motif « Révéler ») est de fournir simplement des références aux propriétés et méthodes que vous voulez être public. Enfin, une troisième technique, j'ai vu était de créer un nouvel objet dans votre fonction de module, auquel vous attribuez vos nouvelles propriétés avant de retourner ledit objet. Ce fut une idée intéressante, mais nécessite la création d'un nouvel objet.

Alors je pensais, pourquoi ne pas simplement utiliser this.propertyName pour affecter vos propriétés et méthodes publiques, et enfin utiliser return this à la fin? De cette façon, semble beaucoup plus simple pour moi, comme vous pouvez créer des propriétés privées et les méthodes avec la syntaxe habituelle var ou function, ou utiliser la syntaxe this.propertyName de déclarer vos méthodes publiques.

Voici la méthode que je suggère:

(function() {

var privateMethod = function () {
    alert('This is a private method.');
}

this.publicMethod = function () {
    alert('This is a public method.');
}

return this;

})();

Y a-t-il des avantages / inconvénients à l'utilisation de la méthode ci-dessus? Qu'en est-il des autres?

Answer 1

Votre fonction n'a pas de contexte d'objet, de sorte que les références de this à l'objet global window dans ce cas. Chaque propriété que vous attribuez à this automatiquement l'espace de noms souille global.

(function() {
    console.log(this == window); // true

    this.publicMethod = function () {
        alert('This is a public method.');
    }

})();

console.log(publicMethod); // function()

Vous pouvez passer explicitement un objet à dire quel contexte à l'utilisation.

var MYAPP = {};

(function() {
    // 'this' will now refer to 'MYAPP'
    this.publicMethod = function () {
        alert('This is a public method.');
    }
}).call(MYAPP);

console.log(publicMethod); // undefined
console.log(MYAPP.publichMethod); // function()

Ce qui vous pouvez écrire dans un style un peu autre:

var MYAPP = (function(my) {
    var my;
    ⋮
    return my;
})(MYAPP);

Et nous sommes arrivés à un modèle déjà discuté . Pour plus de détails, voir l'article de Dustin sur fonctions anonymes portée.

Answer 2

Je recommande le style où vous ajoutez vos propriétés publiques et des méthodes pour un objet anonyme que vous revenez alors:

var myModule = (function() {
    function privateMethod() { ... }
    function publicMethod() { ... }

    return { publicMethod: publicMethod };
})();

Answer 3

si vous souhaitez publier des méthodes, faire quelque chose comme:

var export = (function() {

var privateMethod = function () {
  alert('This is a private method.');
}
var export = {};

export.publicMethod = function () {
  alert('This is a public method.');
}

return export;

})();

Answer 4

Une autre option est d'éviter la cette référence tout à fait. Définir une fonction qui crée et retourne un objet anonyme à la place.

function makeThing(someAttribute) {
  var privateVariable = 42;

  function someMethod() {
    return privateVariable;
  }

  return {
    "publicMethodName": someMethod,
    "getAttribute": function() {
      return someAttribute;
    }
  };
}

var thing = makeThing(99);
thing.publicMethodName();
thing.getAttribute();

Answer 5

Révéler les modèles de module:

var m1 = (function(){ return {method: mthod} })();
var m2 = new function Singleton(){ return {method: mthod} };
var m3 = ({}).prototype = {method: method};
var m4 = ({}).prototype = (function(){ ... })();
var m5 = (function(){}).prototype = {} || (function(){ ... })();

var m6 = (function(extendee){
    return extendee.prototype = {attr3: 'attr3'};
})({currentAttr1: 1, currentAttr2: 2});

En outre, si vous avez besoin méthode Enchaînement:

var m = (function(){}).prototype = (function(){
    var thus = m;  // this
    console.log('m this-------', thus);

    function fn(){
        console.log('fn', thus);
        return thus;
    }
    function f(){
        console.log('f', thus);
        return 'poop';
    }

    return {f: f, fn: fn};
})();

console.log('M:', m, 'm.fn', m.fn(), 'm.fn.f', m.fn().f());

Il y a aussi beaucoup d'autres façons, et vous pouvez protagonize vos modules.