يقوم تحميل الوحدة النمطية بالفعل بتقسيم JS إلى العديد من الوحدات النمطية لسهولة التطوير والصيانة. لذلك ، عند تحميل العديد من وحدات JS ، من الضروري التحميل ديناميكيًا لتحسين تجربة المستخدم.
قبل تقديم مكتبة تحميل الوحدة النمطية ، سنقدم طريقة.
التحميل الديناميكي لطريقة JS:
نسخة الكود كما يلي:
وظيفة loadjs (url ، رد الاتصال) {
var node = document.createElement ("script") ؛
العقدة [window.adDeventListener؟ "Onload": "onReadyStateChange"] = function () {
if (window.addeventListener || /loaded Outcomplete/i.test(node.readyState)) {
أتصل مرة أخرى()؛
node.onReadyStateChange = null ؛
}
}
node.onerror = function () {} ؛
node.src = url ؛
var head = document.getElementSbyTagName ("head") [0] ؛
head.insertbefore (العقدة ، head.firstchild) ؛ // قبل إدخالها في العقدة الأولى من الرأس ، منع علامة الرأس تحت IE6 ، واستخدم AppendChild للإبلاغ عن خطأ.
}
نظرًا لأن Situ Zhengmei استخدم الإطار الشامل الذي كتبته لتقديم تحميل الوحدة النمطية ، فإن الأكثر استخدامًا في هذه الصناعة هو require.js و sea.js. لذلك ، أعتقد أن لديه شخصية قوية.
اسمحوا لي أن أتحدث عن عملية تحميل Sea.js:
يتم تقديم صفحة Chaosan.js في علامة الرأس ، وسيتم الحصول على كائن Seajs.
أيضا تقديم index.js.
رمز الفهرس. js كما يلي:
نسخة الكود كما يلي:
seajs.use (['./ a' ، 'jquery'] ، function (a ، $) {
var num = aa ؛
$ ('#j_a'). text (num) ؛
})
A.JS:
نسخة الكود كما يلي:
تعريف (الوظيفة (تتطلب ، الصادرات ، الوحدة) {
var b = require ('./ b') ؛
var a = function () {
إرجاع 1 + parseint (bb ()) ؛
}
التصدير. أ = أ ؛
})
B.JS:
نسخة الكود كما يلي:
تعريف (الوظيفة (تتطلب ، الصادرات ، الوحدة) {
var c = require ('./ c') ؛
var b = function () {
إرجاع 2 + parseint (cc ()) ؛
}
orports.b = b ؛
})
سي جيه:
نسخة الكود كما يلي:
تعريف (الوظيفة (تتطلب ، الصادرات ، الوحدة) {
var c = function () {
العودة 3 ؛
}
orports.c = c ؛
})
مما سبق ، يمكننا أن نرى أن الوحدة النمطية A تعتمد على B ، و B تعتمد على C.
عندما يدخل البرنامج index.js ، سيقوم Seajs بتسمية طريقة الاستخدام.
نسخة الكود كما يلي:
seajs.use = وظيفة (IDS ، رد الاتصال) {
GlobalModule._use (IDS ، رد الاتصال)
}
الوصف: عند تهيئة GlobalModule في Seajs (عند تقديم Sea.js) ، فإن مثيل الوحدة النمطية Var GlobalModule = وحدة جديدة (util.pageuri ، status.compiled)
في هذا الوقت IDS -> ['./A'Jquery'] ، Callback -> function (a ، $) {var num = aa ؛ $ ('#j_a'). text (num) ؛}
بعد ذلك ، سيتم استدعاء GlobalModule._use (IDS ، رد الاتصال)
نسخة الكود كما يلي:
module.prototype._use = function (ids ، callback) {
var uris = حل (ids ، this.uri) ؛ // قرار ['./a''jquery']
this._load (uris ، function () {// استدعاء عنوان وحدة التحليل A و jQuery [url1 ، url2] واتصل طريقة _Load.
.
var args = util.map (uris ، function (uri) {
إرجاع URI؟ cachedmodules [uri] ._ compile (): null ؛ // في حالة وجود عنوان URL ، اتصل بالطريقة _compile.
})
إذا (رد الاتصال) {callback.apply (null ، args)}
})
}
لأنه بعد استدعاء طريقة _Load ، ستظهر وظيفتان رد اتصال ، لذلك نحن نعلم وظيفة (a ، $) {var num = aa ؛ $ ('#j_a'). text (num) ؛} إلى callback1 ،
قم بتعيين This._load (Uris ، function () {}) علامة رد الاتصال على callback2.
تتمثل طريقة حل في حل عنوان الوحدة ، لذلك لن أخوض في التفاصيل هنا.
أخيرًا ، تم تحليل URIs في var uris = حل (ids ، this.uri) في ['http: //localhost/test/seajs/a.js' ،'http: //localhost/test/seajs/lib/juqery/1.7.2/juqery-debug.js.
وبعد ذلك سيتم تنفيذ This._Load
نسخة الكود كما يلي:
// ستحدد طريقة _Load () أولاً ملفات الموارد غير جاهزة بعد. إذا كانت جميع ملفات الموارد في الحالة الجاهزة ، فسيتم تنفيذ Callback2.
// في هذه الحالة ، سنقوم أيضًا بإعداد تبعيات دائرية وأداء التحميل على JS غير المحملة
module.prototype._load = function (uris ، callback2) {
//UTIL.Filter: دع جميع أعضاء البيانات يقومون بتنفيذ الوظيفة المحددة في وقت واحد وإرجاع مجموعة جديدة. المصفوفة هي عضو يعود صحيحًا بعد تنفيذ رد اتصال من عضو الصفيف الأصلي.
// unloadeduris هي مجموعة من الوحدات التي لم يتم تجميعها
var unloadeduris = util.filter (uris ، function (uri) {
// إرجاع العضو الذي تكون عليه وظيفة تنفيذها في تنفيذ القيمة المنطقية ، ويعود صحيحًا عند وجود URI ولا توجد في cachemodules المتغير الداخلي أو يخزن قيمة الحالة أقل من الحالة. جاهزة في معلومات التخزين
// إذا كانت القيمة العليا هي 4 ، إذا كانت أقل من أربعة ، فمن الممكن أن يتم استردادها وتنزيلها.
إرجاع uri && (! cachedmodules [uri] ||
cachedmodules [uri] .status <status.ready)
}) ؛
// إذا كانت جميع الوحدات النمطية في URIS جاهزة ، فقم بتنفيذ رد الاتصال والخروج من جسم الوظيفة (هذه المرة سيتم استدعاء طريقة _compile للوحدة).
var length = unloadeduris.length
if (length === 0) {callback2 () return}
// عدد الوحدات النمطية التي لم يتم تحميلها
تبقى var = الطول
// إنشاء عمليات إغلاق وحاول تحميل الوحدات التي لم يتم تحميلها
لـ (var i = 0 ؛ i <length ؛ i ++) {
(وظيفة (uri) {
)
وحدة var = cachedmodules [uri] ||
(CacheDmodules [uri] = وحدة جديدة (URI ، status.fetching))
// إذا كانت قيمة الحالة للوحدة أكبر من أو تساوي 2 ، فهذا يعني أنه تم تنزيل الوحدة النمطية وأنها موجودة بالفعل محليًا. في هذا الوقت ، يتم تنفيذ onfetched ()
// خلاف ذلك ، يتم استدعاء Fetch (uri ، onfetched) لمحاولة تنزيل ملف المورد. سيتم تشغيل Onload بعد تنزيل ملف المورد ، وسيتم تنفيذ طريقة OnFetged في Onload.
module.status> = status.fetched؟ onfetched (): جلب (URI ، onfetched)
وظيفة onfetched () {
الوحدة النمطية = cachedmodules [uri]
// عندما تكون قيمة الحالة للوحدة أكبر من أو تساوي الحالة
if (module.status> = status.saved) {
// getPuredependencies: احصل على صفيف التبعية بدون تبعيات دائرية
var deps = getPuredePendencies (الوحدة النمطية)
// إذا لم يكن صفيف التبعية فارغًا
إذا (deps.length) {
// تنفيذ طريقة _Load () مرة أخرى حتى يتم تحميل جميع التبعيات ويتم تنفيذ رد الاتصال بعد اكتمال تحميل جميع التبعيات
module.prototype._load (deps ، function () {
CB (وحدة)
})
}
// إذا كان صفيف التبعية فارغًا ، فنفذ CB (الوحدة النمطية) مباشرة
آخر {
CB (وحدة)
}
}
// إذا فشل الاستحواذ ، مثل 404 أو لا يتوافق مع المواصفات المعيارية
// في هذه الحالة ، سيتم الحفاظ على module.status عند جلبها أو جلبها
آخر {
CB ()
}
}
}) (unloadeduris [i])
}
// طريقة CB - قم بتنفيذ رد الاتصال بعد تحميل جميع الوحدات النمطية
وظيفة CB (وحدة) {
// في حالة وجود معلومات تخزين الوحدة النمطية ، فقم بتعديل قيمة الحالة في معلومات تخزين الوحدة النمطية وتعديلها إلى الحالة.
الوحدة النمطية && (module.status = status.ready)
// يتم تنفيذ عمليات الاسترجاعات فقط عند تحميل جميع الوحدات.
-Remain === 0 && Callback2 ()
}
}
}
هنا ، طول صفيف Umloadeduris هو 2 ، ['http: //localhost/test/seajs/a.js' ،'http: //localhost/test/seajs/lib/juqery/1.7.2/juqery-debug.js']
خذ http: //localhost/test/seajs/a.js كمثال
التالي: أولاً ، سيتم إنشاء وحدة نمطية:
نسخة الكود كما يلي:
cachedmodules ('http: //localhost/test/seajs/a.js') = وحدة جديدة ('http: //localhost/test/seajs/a.js'،1)
module.status> = status.fetched؟ onfetched (): جلب (URI ، onfetched)
نظرًا لأنه لم يتم تحميل الوحدة A في هذا الوقت ، سيتم تنفيذ الجلب (URI ، onfetched) بعد ذلك ، أي جلبه ('http: //localhost/test/seajs/a.js' ، onfetched).
نسخة الكود كما يلي:
جلب الوظيفة (uri ، onfetched) {
// استبدل URI بعنوان الطلب الجديد وفقًا للقواعد الموجودة في الخريطة
var requesturi = util.parsemap (URI)
// أولاً ، اكتشف ما إذا كان سجل requesturi موجودًا في القائمة التي تم الحصول عليها
if (requedlist [requesturi]) {
// في هذا الوقت ، قم بتحديث معلومات تخزين الوحدة النمطية الخاصة بـ URI الأصلية إلى requesturi المعاد تعريفها بواسطة الخريطة
cachedmodules [uri] = cachedmodules [requesturi]
// تنفيذ onfetted و Return ، مما يعني أنه تم الحصول على الوحدة الناجحة بنجاح
onfetched ()
يعود
}
// Query Requesturi معلومات التخزين في قائمة الحصول على
if (fetchinglist [requesturi]) {
// أضف رد الاتصال المقابل لـ URI في قائمة الاتصال والعودة
قائمة الاتصال [requesturi] .push (onfetched) // إذا تم استردادها ، فادفع طريقة رد الاتصال على هذه الوحدة في الصفيف وإعادتها.
يعود
}
// إذا لم تظهر الوحدات التي تحاول الحصول عليها
FetchingList [requesturi] = true
قائمة الاتصال [requesturi] = [onfetched]
// يجلبها
الوحدة النمطية.
طلب ،
وظيفة() {
requedlist [requesturi] = true
// تحديثات الوحدة النمطية
// إذا كانت module.status تساوي الحالة.
وحدة var = cachedmodules [uri]
if (module.status === status.fetching) {
module.status = status.fetched
}
if (fetchinglist [requesturi]) {
حذف reginglist [requesturi]
}
// استدعاءات الاتصال عبر الاتصال التنفيذ للاسترجاع
if (callbacklist [requesturi]) {
util.foreach (callbacklist [requesturi] ، function (fn) {
fn () // fn هي الطريقة onfeched المقابلة للوحدة أ.
})
حذف قائمة الاتصال [requesturi]
}
} ،
config.charset
)
}
بعد ذلك ، سيتم تنفيذ الوحدة النمطية.
هذه الطريقة هي استدعاء طريقة loadjs لتنزيل ملف A.JS ديناميكيًا. (نظرًا لوجود A و jQuery ، سيتم إنشاء نصين جديدان). هناك سؤال هنا. إذا قمت بإنشاء برنامج نصي لـ A وأضفته إلى الرأس ، فستقوم بتنزيل ملف JS. ومع ذلك ، في Seajs ، لم يتم تنزيله. بدلاً من ذلك ، سوف تنتظر حتى يتم إنشاء البرنامج النصي الخاص بـ JQuery وإضافته إلى الرأس قبل تنزيله (يقوم Google Debugger بتعيين نقطة توقف ، ويستمر في إظهار الانتظار المعلق). هل هذا لماو؟
(موصى به هنا: http://ux.sohu.com/topics/50972d9ae7de3e752e0081ff. سأتحدث عن أسئلة إضافية هنا. قد تعرف لماذا نحتاج إلى استخدام الجداول لتخطيط أقل ، لأنه عندما يتم تقديم الجدول ، يجب أن يحسب عدة مرات ، أثناء احتياجات Div مرة واحدة فقط. سيتم عرضه ، وسيتم عرض DIV بقدر ما يتم تحليله بعد التحقق من ذلك ، إذا كان هناك علامة tbody في الجدول
بعد نجاح التنزيل ، سيتم تحليله وتنفيذه ، ويتم تنفيذ طريقة تعريف. سنقوم أولاً بتنفيذ رمز الوحدة النمطية أ.
DEFINE (id ، deps ، function () {}) تحليل الطريقة
نسخة الكود كما يلي:
// تعريف التعريف ، المعرف: معرف الوحدة ، DEPS: تبعية الوحدة النمطية ، المصنع
module._define = function (id ، deps ، factory) {
// حل التبعيات // إذا لم يكن DEPS نوع صفيف ، فإن المصنع هو وظيفة
if (! util.isarray (deps) && util.isfunction (المصنع))
deps = util.parsedependencies (Factory.ToString ())
}
// تعيين معلومات التعريف
var meta = {id: id ، التبعيات: DEPS ، المصنع: المصنع}
if (document.attachevent) {
// احصل على عقدة البرنامج النصي الحالي
var script = util.getCurrentscript ()
// إذا كانت عقدة البرنامج النصي موجودة
if (script) {
// احصل على عنوان URI الأصلي
deriveduri = util.unparsemap (util.getScriptAbsolutesrc (script))}
إذا (! deriveduri) {
util.log ('فشل في استخلاص URI من البرنامج النصي التفاعلي لـ:' ، Factory.ToString () ، 'Warn')
}
}
.........
}
سيقوم Define أولاً بإجراء حكم على المصنع لتحديد ما إذا كانت وظيفة (والسبب هو أن التعريف يمكن أن يتضمن أيضًا الملفات والكائنات)
إذا كانت وظيفة ، فسيتم الحصول على الوظيفة من خلال المصنع.
بالنسبة إلى A.JS ، فإن تبعيةها هي B.JS لذلك DEPS هي ['./b']
وحفظ معلومات A.JS var meta = {id: id ، التبعيات: DEPS ، المصنع: المصنع}
لـ A.JS meta = {id: undefined ، التبعيات: ['./b'] ، المصنع: function (xxx) {xxx}}
في متصفح IE 6-9 ، يمكنك الحصول على المسار لتشغيل JS. ومع ذلك ، في المتصفح القياسي ، هذا غير ممكن ، بحيث يمكنك تعيين معلومات التعريف إلى AnonymousModuleMeta = meta.
ثم تشغيل Onload ، وسيتم استدعاء طريقة رد الاتصال Callback3. ستعدل طريقة رد الاتصال هذه قيمة الحالة لوحدة رد الاتصال الحالية (A.JS) وتعيينها على module.status = status.fetched.
بعد ذلك ، سيتم تنفيذ رد الاتصال المقابل لـ A.JS في قائمة رد الاتصال على قائمة الانتظار بشكل موحد ، أي ، تم وضعه.
تتحقق طريقة onfetged ما إذا كانت الوحدة A لديها وحدة تعتمد. لأن A يعتمد على B ، قم بتنفيذ _Load () على B.JS التي تعتمد على الوحدة النمطية A.
سيتم تنزيل وحدة B ، وسيتم تنفيذ طريقة تعريف jQuery أولاً. لأن jQuery لا يعتمد على الوحدات النمطية ، بعد رد الاتصال. مكالمات onfetged طريقة CB.
عندما يتم تنفيذ B في نفس العملية مثل A ، سيتم تنزيل الوحدة C. أخيرًا ، يتم تنزيل وحدات C ، B ، A ، وبعد الانتهاء من التشغيل ، سيتم أيضًا استدعاء طريقة CB (First C ، ثم B ، ثم C)
بعد جميع الوحدات جاهزة ، سيتم استدعاء طريقة Callback2.
أخيرًا ، يتم استدعاء رد الاتصال Back2 ويتم تنفيذ طريقة _compile لوحدات A و jQuery:
أولاً ، قم بتجميع وحدة A.JS ، وتنفيذ وظيفة الوحدة النمطية أ. نظرًا لأن A يتطلب (B.JS) فيه ، فسيقوم بتنفيذ وظيفة الوحدة النمطية ب.
تبدأ وظيفة الوحدة A التنفيذ
تبدأ وظيفة الوحدة B في التنفيذ
تبدأ وظيفة الوحدة C في التنفيذ
تم الانتهاء من تنفيذ وظيفة الوحدة C
تم الانتهاء من تنفيذ وظيفة الوحدة B
تم الانتهاء من تنفيذ وظيفة الوحدة A
أخيرًا ، قم بتنفيذ وظيفة jQuery.
بعد التجميع ، قم بتنفيذ Callback1 ويمكنك استخدام كائنات A و jQuery.
ملاحظة: تم تحديث إصدار Seajs ، ولا توجد طريقة _compile الآن. (الجميع يذهب لرؤيتها بنفسك ، أريد أن أراها أيضًا)
دعنا نتحدث عن عملية compilation_compile MODULE SEJS.
أولاً ، تجميع A.JS
نسخة الكود كما يلي:
module.prototype._compile = function () {
126 var module = هذا
127 // إذا تم تجميع الوحدة النمطية ، فسيتم إرجاع الوحدة النمطية مباشرة
128 if (module.status === status.compiled) {
129 الإرجاع وحدة
130}
133 // 1. ملف الوحدة هو 404.
134 // 2. لم يتم كتابة ملف الوحدة النمطية بتنسيق وحدة صالح.
135 // 3. حالات خطأ أخرى.
136 // فيما يلي بعض الاستثناءات للتعامل معها ، ثم إرجاع NULL مباشرة
137 if (module.status <status.saved &&! hasmodifiers (وحدة)) {
138 عودة لاغية
139}
140 // قم بتغيير حالة الوحدة النمطية للتجميع ، مما يعني تجميع الوحدة النمطية
141 module.status = status.compiling
142
143 // الاستخدام الداخلي للوحدة عبارة
144 وظيفة تتطلب (معرف) {
145 // مسار مسار الوحدة النمطية وفقًا للمعرف
146 var uri = حل (id ، module.uri)
147 // احصل على وحدات من ذاكرة التخزين المؤقت للوحدة (لاحظ أنه تم تنزيل تبعيات الجهاز الفرعي كوحدة رئيسية)
148 var child = cachedmodules [uri]
149
150 // فقط إرجاع فارغ عندما يكون URI غير صالح.
151 // إذا كان الطفل فارغًا ، فقد يعني ذلك فقط أن المعلمة تم ملؤها بشكل غير صحيح ، ثم إعادة فارغ مباشرة
152 إذا (! طفل) {
153 عودة لاغية
154}
155
156 // يتجنب المكالمات الدائرية.
157 // إذا كانت حالة الجهاز الفرعي هي الحالة.
158 if (child.status === status.compiling) {
159 إرجاع الطفل
160}
161 // أشر إلى الوحدة النمطية التي تستدعي الوحدة الحالية أثناء التهيئة. بناءً على هذه الخاصية ، يمكنك الحصول على مكدس الاتصال عند تهيئة الوحدة النمطية.
162 child.parent = الوحدة النمطية
163 // إرجاع الوحدة النمطية.
164 Return Child._compile ()
165}
166 // يستخدم داخليًا لتحميل الوحدة النمطية بشكل غير متزامن وتنفيذ رد الاتصال المحدد بعد اكتمال التحميل.
167 requist.async = function (ids ، callback) {
168 MODULE._USE (IDS ، رد الاتصال)
169}
170 // استخدم آلية دقة المسار داخل نظام الوحدة النمطية لتحليل مسار الوحدة النمطية وإرجاعها. لا تقوم هذه الوظيفة بتحميل الوحدة ، ولا تُرجع إلا المسار المطلق المحسّن.
171 requist.Resolve = function (id) {
172 عودة حل (ID ، module.uri)
173}
174 // من خلال هذه الخاصية ، يمكنك عرض جميع الوحدات النمطية التي تم تحميلها بواسطة نظام الوحدة النمطية.
175 // في بعض الحالات ، إذا كنت بحاجة إلى إعادة تحميل وحدة نمطية ، فيمكنك الحصول على URI للوحدة ، ثم حذف معلوماتها عن طريق حذف requist.cache [uri]. سيتم إعادة تشكيل هذا في المرة القادمة التي تستخدمها.
176 requist.cache = cachedmodules
177
178 // تتطلب طريقة للحصول على واجهات توفرها وحدات أخرى.
179 الوحدة النمطية.
180 // الصادرات هو كائن يوفر واجهات الوحدة النمطية إلى الخارج.
181 module.exports = {}
182 Var Factory = module.Factory
183
184 // عندما يكون المصنع وظيفة ، فإنه يمثل مُنشئ الوحدة النمطية. من خلال تنفيذ هذه الطريقة ، يمكنك الحصول على الواجهة التي توفرها الوحدة النمطية إلى الخارج.
185 if (util.isfunction (Factory)) {
186 Compilestack.push (وحدة)
187 RunInmoduleContext (مصنع ، وحدة)
188 Compilestack.pop ()
189}
190 // عندما يكون المصنع نوعًا غير وظيفي مثل كائن ، وسلسلة ، وما إلى ذلك ، فإن الواجهة التي تمثل الوحدة هي الكائن والسلسلة والقيم الأخرى.
191 // على سبيل المثال: define ({"foo": "bar"}) ؛
192 // على سبيل المثال: define ('أنا قالب. اسمي {{name}}.') ؛
193 آخر إذا (المصنع! == غير محدد) {
194 الوحدة النمطية = المصنع
195}
196
197 // قم بتغيير حالة الوحدة النمطية التي تم تجميعها ، مما يعني تم تجميع الوحدة النمطية
198 Module.Status = status.compiled
199 // تنفيذ تعديل واجهة الوحدة النمطية ، من خلال seajs.modify ()
200 execmodiers (وحدة)
201 وحدة الإرجاع
202}
نسخة الكود كما يلي:
if (util.ispunction (مصنع)) {
186 Compilestack.push (وحدة)
187 RunInmoduleContext (مصنع ، وحدة)
188 Compilestack.pop ()
189}
هنا هو تهيئة الوحدة النمطية. طريقة RunInmoduleContext:
نسخة الكود كما يلي:
// قم بتنفيذ رمز الوحدة النمطية وفقًا لسياق الوحدة النمطية
489 وظيفة RunInModuleContext (FN ، الوحدة النمطية) {
490 // تمرير في معلمتين تتعلق بالوحدة والوحدة نفسها
491 // يتم استخدام الصادرات لفضح الواجهات
يتم استخدام 492 // المتطلبات للحصول على وحدات تابعة (متزامنة) (ترجمة)
493 var ret = fn (module.require ، module.exports ، module)
494 // يدعم نموذج واجهة التعرض لقيمة الإرجاع ، مثل:
495 // return {
496 // fn1: xx
497 // ، fn2: xx
498 // ...
499 //}
500 if (ret! == undefined) {
501 module.exports = ret
502}
503}
تنفيذ طريقة الوظيفة في A.JS ، ثم var b = يتطلب ("B.JS") سيتم استدعاؤها ،
ستُرجع طريقة المتطلبات قيمة إرجاع طريقة ترجمة B ، وهناك var c = require ('c.js') في وحدة B.
في هذا الوقت ، سيتم استدعاء طريقة ترجمة C ، ثم سيتم استدعاء وظيفة C. في C ، إذا كان الكائن يجب تعريضه ، أو يتم إرجاع كائن الإرجاع C ، فستكون صادرات الوحدة النمطية C هي الصادرات = C. أو مباشرة module.export = c ؛ باختصار ، سيتم إرجاع الوحدة النمطية C.Export = C في النهاية ؛ لذلك var c = الوحدة c.export = c. في الوحدة B ، يمكنك استخدام متغير C لاستدعاء طرق وخصائص كائن C في الوحدة C.
عن طريق القياس ، يمكن للوحدة A في النهاية استدعاء خصائص وطرق الكائن B في الوحدة B.
بغض النظر عن الوحدة النمطية ، طالما كنت تستخدم الوحدة النمطية. export = xx ، يمكن أن تستخدم الوحدات الأخرى ("وحدة XX") لاستدعاء طرق مختلفة في وحدة XX.
ستصبح حالة الوحدة النهائية module.status = status.compiled.
نسخة الكود كما يلي:
module.prototype._use = function (ids ، callback) {
var uris = حل (ids ، this.uri) ؛ // قرار ['./a''jquery']
this._load (uris ، function () {// استدعاء عنوان وحدة التحليل A و jQuery [url1 ، url2] واتصل طريقة _Load.
.
var args = util.map (uris ، function (uri) {
إرجاع URI؟ cachedmodules [uri] ._ compile (): null ؛ // في حالة وجود عنوان URL ، اتصل بالطريقة _compile.
})
إذا (رد الاتصال) {callback.apply (null ، args)}
})
}
في هذا الوقت args = [الوحدة A.export ، الوحدة النمطية jquery.export] ؛
نسخة الكود كما يلي:
seajs.use (['./ a' ، 'jquery'] ، function (a ، $) {
var num = aa ؛
$ ('#j_a'). text (num) ؛
})
في هذا الوقت ، A و $ في الوظيفة هما الوحدة A.Export و MODULE JQUERY.EXPORT.
لأنني الآن أدرس رمز مصدر jQuery وتصميم إطار عمل jQuery ، أشارك بعض الخبرة:
رمز مصدر jQuery ، لقد قرأت الكثير من التحليل عبر الإنترنت ، لكن لا يمكنني قراءته بعد الآن وأنا أنظر إليه. هذا ليس ذا مغزى للغاية ، لذلك أوصي بتحليل رمز المصدر الخاص بـ Miaowei Classroom.
يعد تصميم إطار JavaScript الخاص بـ Situ Zhengmei صعبًا ، ولكن بعد القراءة الدقيقة ، ستصبح مهندسًا كبيرًا في الواجهة الأمامية.
أقترح تعلم واستخدام Sea.js Yu Bo ، بعد كل شيء ، يصنعه الصينيون أنفسهم. سيتم إجراء مشاريع أو إعادة بناء شركتنا باستخدام Seajs.
التالي هو القراءة المكثفة لعمليات الكود المصدري للأشرطة اليدوية المعيارية والعمود الفقري MVC أو MVVM Angular. آمل هنا أن يقدم لي شخص ما اقتراحات بشأن الكتب والمواقع الإلكترونية ومقاطع الفيديو التي يجب تعلمها بسرعة.