หลังจากสับสนอยู่พักหนึ่งในที่สุดฉันก็มีเงื่อนงำ มันประมาณ:
การคัดลอกรหัสมีดังนี้:
สร้างฟังก์ชั่นที่ไม่ระบุชื่อการเรียกตนเองออกแบบหน้าต่างพารามิเตอร์และส่งผ่านในวัตถุหน้าต่าง
วัตถุประสงค์ของกระบวนการนี้คือ
การคัดลอกรหัสมีดังนี้:
ทำให้รหัสของคุณเองไม่ปนเปื้อนรหัสอื่น ๆ และในเวลาเดียวกันก็ไม่สามารถปนเปื้อนรหัสอื่น ๆ ได้
jQuery encapsulation
ดังนั้นฉันจึงพบ jQuery เวอร์ชันก่อนหน้าและรหัส encapsulation ในหมายเลขเวอร์ชันคือ 1.7.1 เป็นประมาณต่อไปนี้
การคัดลอกรหัสมีดังนี้:
(ฟังก์ชั่น (หน้าต่างที่ไม่ได้กำหนด) {
var jQuery = (function () {console.log ('hello');});
window.jQuery = window. $ = jQuery;
if (typeof define === "function" && define.amd && define.amd.jQuery) {
กำหนด ("jQuery", [], function () {return jQuery;});
-
})( หน้าต่าง );
ในหมู่พวกเขา
การคัดลอกรหัสมีดังนี้:
console.log ('สวัสดี');
มันถูกใช้เพื่อตรวจสอบว่ามันใช้งานได้ตามที่กล่าวไว้ในตอนแรกดังนั้นเราจึงสามารถโทรหา jQuery ในหน้าต่าง
การคัดลอกรหัสมีดังนี้:
หน้าต่าง. $
หรือ
การคัดลอกรหัสมีดังนี้:
window.jquery
ดังนั้นเราจึงสามารถสร้างแพ็คเกจที่คล้ายกันได้
การคัดลอกรหัสมีดังนี้:
(ฟังก์ชั่น (หน้าต่างที่ไม่ได้กำหนด) {
var pH = function () {
-
})(หน้าต่าง)
เมื่อเทียบกับข้างต้นมีเพียงสองขั้นตอนที่หายไป
1. กำหนดสัญลักษณ์และการโทรทั่วโลกของ jQuery
2. การสนับสนุนแบบอะซิงโครนัส
ดังนั้นฉันจึงพบ jQuery encapsulation ก่อนหน้านี้ซึ่งประมาณเดียวกันในแง่ของวิธีการยกเว้น -
การคัดลอกรหัสมีดังนี้:
if (typeof window.jQuery == "undefined") {
var jQuery = function () {};
if (typeof $! = "undefined")
jQuery ._ $ = $;
var $ = jQuery;
-
มันวิเศษมากที่เราไม่สามารถเขียนขั้นตอนก่อนหน้านี้ได้ ดังนั้นฉันต้องดูว่า jQuery encapsulation ล่าสุดเป็นอย่างไร ดังนั้นฉันจึงเปิด 2.1.1 และพบว่ายกเว้นการเพิ่มฟังก์ชั่นจำนวนมากความคิดของฉันไม่เปลี่ยนแปลงโดยทั่วไป
การคัดลอกรหัสมีดังนี้:
(ฟังก์ชั่น (ทั่วโลก, โรงงาน) {
if (typeof module === "Object" && typeof module.exports === "Object") {
module.exports = global.document?
โรงงาน (ทั่วโลกจริง):
ฟังก์ชั่น (w) {
if (! w.document) {
โยนข้อผิดพลาดใหม่ ("jQuery ต้องการหน้าต่างที่มีเอกสาร");
-
Return Factory (W);
-
} อื่น {
โรงงาน (ทั่วโลก);
-
} (หน้าต่าง typeof! == "ไม่ได้กำหนด" หน้าต่าง: นี่, ฟังก์ชั่น (หน้าต่าง, noglobal) {
var jQuery = function () {
console.log ('jQuery');
-
if (typeof define === "function" && define.amd) {
กำหนด ("jQuery", [], function () {
กลับ jQuery;
-
-
strundefined = typeof undefined;
if (typeof noglobal === strundefined) {
window.jQuery = window. $ = jQuery;
-
กลับ jQuery;
-
เมื่อใช้เบราว์เซอร์
การคัดลอกรหัสมีดังนี้:
typeof module = "undefined"
ดังนั้นสถานการณ์ข้างต้นจะถูกตัดสินเมื่อใช้ node.js ฯลฯ ซึ่งบ่งชี้ว่า jQuery กำลังป่อง
แพ็คเกจกระดูกสันหลัง
เปิดกระดูกสันหลังและตรวจสอบ
การคัดลอกรหัสมีดังนี้:
(ฟังก์ชั่น (รูท, โรงงาน) {
if (typeof define === 'function' && define.amd) {
กำหนด (['Underscore', 'JQuery', 'Exports'], ฟังก์ชั่น (_, $, การส่งออก) {
root.backbone = โรงงาน (รูท, ส่งออก, _, $);
-
} อื่นถ้า (typeof exports! == 'undefined') {
var _ = ต้องการ ('ขีดล่าง');
โรงงาน (รูท, ส่งออก, _);
} อื่น {
root.backBone = โรงงาน (root, {}, root._, (root.jQuery || root.zepto || root.ender || root. $));
-
} (นี่คือฟังก์ชัน (รูท, แบ็คโบน, _, $) {
กระดูกสันหลัง. $ = $;
กลับกระดูกสันหลัง;
-
นอกเหนือจากการสนับสนุนแบบอะซิงโครนัสแล้วยังสะท้อนถึงการพึ่งพา jQuery และขีดเส้นใต้
การคัดลอกรหัสมีดังนี้:
กำหนด (['Underscore', 'JQuery', 'Exports'], ฟังก์ชั่น (_, $, การส่งออก) {
root.backbone = โรงงาน (รูท, ส่งออก, _, $);
-
มันบ่งชี้ว่ากระดูกสันหลังได้รับการสนับสนุนโดย NeutionJS
แพ็คเกจขีดล่าง
ดังนั้นฉันดูขีดล่างอีกครั้งและพบว่าห้องสมุดนี้มีสัญลักษณ์อื่น _
การคัดลอกรหัสมีดังนี้:
(การทำงาน() {
var root = this;
var _ = ฟังก์ชั่น (obj) {
ถ้า (OBJ instanceof _) ส่งคืน OBJ;
if (! (อินสแตนซ์นี้ _)) ส่งคืนใหม่ _ (obj);
this._wrapped = obj;
-
if (typeof exports! == 'undefined') {
if (typeof module! == 'undefined' && module.exports) {
การส่งออก = module.exports = _;
-
ส่งออก _ = _;
} อื่น {
root._ = _;
-
if (typeof define === 'function' && define.amd) {
กำหนด ('ขีดล่าง', [], function () {
กลับ _;
-
-
} .CALL (นี่));
โดยรวมแล้วพวกเขาเกือบจะเป็นฟังก์ชันที่ไม่ระบุชื่อยกเว้นว่าใช้วิธีการโทร () ในที่สุด