Après avoir été confus pendant un certain temps, j'ai finalement eu un indice. C'est à peu près:
La copie de code est la suivante:
Créez une fonction anonyme autonome, concevez la fenêtre du paramètre et passez-la dans l'objet Window.
Le but de ce processus est,
La copie de code est la suivante:
Faites votre propre code non contaminé par d'autres codes, et en même temps, il ne peut pas contaminer d'autres codes.
Encapsulation JQuery
J'ai donc trouvé une version antérieure de jQuery, et le code d'encapsulation dans le numéro de version est 1.7.1 est à peu près le suivant
La copie de code est la suivante:
(fonction (fenêtre, indéfinie) {
var jQuery = (function () {console.log ('hello');});
window.jquery = fenêtre. $ = jQuery;
if (typeof define === "fonction" && define.amd && define.amd.jquery) {
Define ("jQuery", [], function () {return jQuery;});
}
})( fenêtre );
Parmi eux
La copie de code est la suivante:
Console.log ('Hello');
Il est utilisé pour vérifier si cela fonctionne comme mentionné au début, afin que nous puissions appeler jQuery dans la fenêtre
La copie de code est la suivante:
fenêtre. $
Ou
La copie de code est la suivante:
window.jquery
Afin que nous puissions créer un package similaire
La copie de code est la suivante:
(fonction (fenêtre, indéfinie) {
var ph = fonction () {
}
})(fenêtre)
Par rapport à ce qui précède, il ne manque que deux étapes
1. Définir les symboles et les appels mondiaux de jQuery
2. Support asynchrone
J'ai donc trouvé l'encapsulation jQuery précédente, qui était à peu près la même en termes de méthode, sauf. .
La copie de code est la suivante:
if (typeof window.jquery == "Undefined") {
var jQuery = function () {};
if (typeof $! = "Undefined")
jQuery ._ $ = $;
var $ = jQuery;
};
C'est tellement magique que nous ne pouvons pas réécrire l'étape précédente jQuery. J'ai donc dû voir à quoi ressemble la dernière encapsulation de jQuery. J'ai donc ouvert 2.1.1 et j'ai constaté qu'à l'exception de l'ajout de nombreuses fonctions, mes idées sont fondamentalement inchangées.
La copie de code est la suivante:
(fonction (global, usine) {
if (typeof module === "objet" && typeof module.exports === "objet") {
module.exports = global.Document?
usine (global, vrai):
fonction (w) {
if (! W.Document) {
Jetez une nouvelle erreur ("jQuery nécessite une fenêtre avec un document");
}
Retour Factory (W);
};
} autre {
usine (global);
}
} (Typeof Window! == "Undefined"? Window: this, function (window, noglobal) {
var jQuery = function () {
console.log ('jQuery');
};
if (typeof define === "fonction" && define.amd) {
définir ("jQuery", [], fonction () {
retourner jQuery;
});
};
StrundEfined = type de non défini;
if (typeof noglobal === StrundEfined) {
window.jquery = fenêtre. $ = jQuery;
};
retourner jQuery;
}));
Lorsque vous utilisez un navigateur
La copie de code est la suivante:
typeof module = "Undefined"
Ainsi, la situation ci-dessus est jugée lors de l'utilisation de Node.js, etc., ce qui indique également que jQuery est devenu gonflé.
Package de squelette
Ouvrez la colonne vertébrale et vérifiez-la
La copie de code est la suivante:
(fonction (root, usine) {
if (typeof define === 'function' && define.amd) {
Define ([«sous-traitant», «jQuery», «Exports»], fonction (_, $, exportations) {
root.backbone = usine (root, exportations, _, $);
});
} else if (typeof exportts! == 'Undefined') {
var _ = require ('calendrier');
usine (root, exportations, _);
} autre {
root.backbone = factory (root, {}, root._, (root.jquery || root.zepto || root.ender || root. $));
}
} (ceci, fonction (root, squelette, _, $) {
Backbone. $ = $;
retour de l'épine dorsale;
}));
En plus du soutien asynchrone, il reflète également sa dépendance à l'égard de jQuery et de souligner.
La copie de code est la suivante:
Define ([«sous-traitant», «jQuery», «Exports»], fonction (_, $, exportations) {
root.backbone = usine (root, exportations, _, $);
});
Il indique que l'épine dorsale est soutenue nativement par les obligations.
Package de soulignement
Alors, j'ai regardé à nouveau sous-coré et j'ai constaté que cette bibliothèque occupait un autre symbole_
La copie de code est la suivante:
(fonction() {
var root = this;
var _ = fonction (obj) {
if (obj instanceof _) return obj;
if (! (Cette instance _)) renvoie nouveau _ (obj);
this._wrapy = obj;
};
if (typeof exportts! == 'Undefined') {
if (typeof module! == 'Undefined' && module.exports) {
exports = module.exports = _;
}
export._ = _;
} autre {
root._ = _;
}
if (typeof define === 'function' && define.amd) {
définir ('calendrier', [], function () {
retour _;
});
}
} .call (this));
Dans l'ensemble, ce sont des fonctions presque anonymes, sauf que la méthode Call () est utilisée à la fin.