จำเป็นต้อง:
ตามไฟล์กำหนดค่าด้านล่าง
การคัดลอกรหัสมีดังนี้:
โมดูล = [
{'ชื่อ': 'jQuery', 'src': '/js/lib/jQuery-1.8.3.js'},
{'ชื่อ': 'swfobject', 'src': '/js/utils/swfobject.js'},
{'Name': 'FancyBox', 'Src': '/js/jQuery/jQuery.fancybox.js', 'ต้องการ': ['jQuery']},
{'NAME': 'UPLOADIFY', 'SRC': '/JS/UTILS/UPLOADIFY.JS', 'ต้องการ': ['SWFOBJECT']},
{'ชื่อ': 'jqform', 'src': '/js/jQuery/jQuery.form.js', 'ต้องการ': ['jQuery']},
{'ชื่อ': 'ลงทะเบียน', 'src': '/js/page/reg.js', 'ต้องการ': ['jqform']},
{'ชื่อ': 'เข้าสู่ระบบ', 'src': '/js/page/login.js', 'ต้องการ': ['fancebox', 'jqform']},
{'ชื่อ': 'อัปโหลด', 'src': '/js/page/upload.js', 'ต้องการ': ['fancebox', 'jqform', 'uploadify']}
-
เขียนฟังก์ชั่น
def getFiles (ชื่อ)
กลับไปที่หน้าเว็บที่ระบุด้วยชื่อที่แน่นอนรายการไฟล์ JS ที่จะโหลดและไฟล์ที่มีการอ้างอิงจะต้องโหลดก่อน
วิธีแก้ปัญหา
คำถามนี้ดูง่ายในตอนแรก แต่ก็ไม่ใช่
ความยากลำบากอยู่ในช่วงเวลาการโหลดของโมดูลการพึ่งพา หากมีการพึ่งพา: AB&C, BC, โมดูล A ขึ้นอยู่กับโมดูล B และโมดูล C และโมดูล B ขึ้นอยู่กับโมดูล C คุณจะไม่สามารถโหลด C ได้สองครั้ง!
วิธีแก้ปัญหาที่ Xiaocai เป็นเพียงความคิดและจะต้องมีอัลกอริทึมที่ดีกว่านี้ Xiaocai คิดว่ามันสามารถแก้ไขได้โดยใช้อัลกอริทึมเช่นต้นไม้ไบนารี แต่ Xiaocai ไม่รู้ว่าจะทำอย่างไร ~~~
อัลกอริทึมนี้ไม่ได้พิจารณาสถานการณ์การพึ่งพาเป็นวงกลม
รหัสมีดังนี้:
การคัดลอกรหัสมีดังนี้:
-
* ไม่มีการพิจารณาการพึ่งพาแบบวงกลม
* @type {function}
-
var loadModule = (function () {
-
* การห่อหุ้มตรรกะทางธุรกิจ
* @type {{chainhead: {}, chaincurrent: {}, srccache: {}, หลัก: หลัก, โหลด: โหลด, findmodule: findModule}}}
-
var logics = {
chainhead: {}, // ส่วนหัวรายการลิงก์
chaincurrent: {}, // โหนดปัจจุบันของรายการที่เชื่อมโยง
srccache: {}, // โมดูล SRC Cache
-
* อินเทอร์เฟซภายนอก
* @param โมดูลวัตถุกำหนดค่า
* @param ชื่อชื่อโมดูล
* @returns {array} รายการโมดูลการพึ่งพาเรียงลำดับตามลำดับของการโหลด
-
หลัก: ฟังก์ชั่น (โมดูลชื่อ) {
var namearray = [], // รายการชื่อโมดูล
srcarray = [], // รายการโมดูลการพึ่งพา
namestr = "", // ตั้งชื่อสตริงชื่อโมดูล
repeatregex =/(^|) ([/w]+).*/2/, // ชื่อโมดูลซ้ำซ้อนปกติ
i = 0;
// โหลดหยาบโมดูลการพึ่งพาทั้งหมด
this.load (โมดูลชื่อ)
// การสร้างชุดสตริงชื่อโมดูล
this.chaincurrent = this.chainhead;
ในขณะที่ (this.chaincurrent.next) {
namearray.push (this.chaincurrent.name);
this.chaincurrent = this.chaincurrent.next;
-
namestr = namearray.join ("") + ""; // มาตรฐานแบบครบวงจรเติมช่องว่างในตอนท้าย
// ขึ้นอยู่กับโมดูลที่จะลดลง
ในขณะที่ (repeatregex.exec (namestr)) {
namestr = namestr.replace (repeatregex, function (g0, g1, g2) {
ส่งคืน g0.substring (0, (g0.length - g2.length));
-
-
namestr = namestr.substring (0, (namestr.length - 1)); // ลบช่องว่างเพิ่มเติมเพิ่มเติม
// แปลงชื่อโมดูลการพึ่งพาเป็นพา ธ โมดูล
namearray = namestr.split ("");
สำหรับ (i = 0; i <namearray.length; i ++) {
srcarray.push (this.srccache [namearray [i]]);
-
กลับ srcarray;
-
-
* โหลดโมดูลซ้ำ
* @param โมดูลวัตถุกำหนดค่า
* @param ชื่อชื่อโมดูล
-
โหลด: ฟังก์ชั่น (โมดูลชื่อ) {
var node = {}
module = this.findModule.call (โมดูล, "ชื่อ", ชื่อ),
i = 0;
// ตัดสินว่ามีโมดูลอยู่หรือไม่
ถ้า (! โมดูล) {
การโยนข้อผิดพลาด ("ขึ้นอยู่กับโมดูล" + ชื่อ + "ไม่พบ");
-
// การสร้างรายการลิงค์การพึ่งพาโมดูล
node.name = ชื่อ;
// node.src = module.src;
this.srccache [ชื่อ] = module.src;
node.next = this.chainhead;
this.chainhead = node;
// การพึ่งพาซ้ำ
if (module.require && module.require.length) {
สำหรับ (i = 0; i <module.require.length; i ++) {
this.load (โมดูล, module.require [i]);
-
-
-
-
* ค้นหาโมดูลตามชื่อแอตทริบิวต์ที่ระบุและค่าแอตทริบิวต์
* ชื่อแอตทริบิวต์ชื่อ @param
* ค่าแอตทริบิวต์ค่า @param
* @returns {*}
-
FindModule: ฟังก์ชั่น (ชื่อ, ค่า) {
var array = สิ่งนี้
item = {}
i = 0;
// การถ่ายโอนโมดูล
สำหรับ (i = 0; i <array.length; i ++) {
item = array [i];
// รับโมดูลที่ระบุ
if (item && item [name] === ค่า) {
รายการส่งคืน;
-
-
// ไม่พบ null return
คืนค่า null;
-
-
// เปิดเผยอินเทอร์เฟซภายนอก
return function () {
return logics.main.apply (logics, อาร์กิวเมนต์);
-
-
-
* ทดสอบ usecase
* @พิมพ์ {*[]}
-
โมดูล var = [
{'ชื่อ': 'jQuery', 'src': '/js/lib/jQuery-1.8.3.js'},
{'ชื่อ': 'swfobject', 'src': '/js/utils/swfobject.js'},
{'Name': 'FancyBox', 'Src': '/js/jQuery/jQuery.fancybox.js', 'ต้องการ': ['jQuery']},
{'NAME': 'UPLOADIFY', 'SRC': '/JS/UTILS/UPLOADIFY.JS', 'ต้องการ': ['SWFOBJECT']},
{'ชื่อ': 'jqform', 'src': '/js/jQuery/jQuery.form.js', 'ต้องการ': ['jQuery']},
{'ชื่อ': 'ลงทะเบียน', 'src': '/js/page/reg.js', 'ต้องการ': ['jqform']},
{'ชื่อ': 'เข้าสู่ระบบ', 'src': '/js/page/login.js', 'ต้องการ': ['fancebox', 'jqform']},
{'ชื่อ': 'อัปโหลด', 'src': '/js/page/upload.js', 'ต้องการ': ['fancebox', 'jqform', 'เข้าสู่ระบบ', 'uploadify']}
-
console.log (loadModule (โมดูล, "อัปโหลด"));