2014-01-20 4 views
4

У меня есть интересная концепция, над которой я работал и просматривал различные вопросы о загрузке JavaScript. Я не хочу использовать сторонний инструмент, кроме формы jquery, поэтому я думал, что буду играть роль самостоятельно. Концепция у меня есть:Автозагрузка Javascript

var scripts = { 
    'name' : 'path/to/script_dir/' // Load all scripts in this file. 
} 

requireScripts(scripts); // Requires all scripts 
// Call your classes, methods, objects and so on .... 

requireScript() функция будет работать что-то вроде:

function requireScript(hash){ 
    $.each(hash, function(key, value)){ 
     $.ajax({ 
      url: value, 
      dataType: "script", 
      async: false, 
      error: function() { 
       throw new Error("Could not load script " + script); 
      } 

     }); 
    }); 
} 

Примечание: выше, является просто концепция, я не думаю, что он будет работать.

Вышеупомянутое позволит загружать КОНКРЕТНЫЕ скрипты. поэтому по существу значение вашего хэш-ключа будет 'name' : 'path/to/specific/script'. Проблема заключается в том, что ваш хэш будет довольно большим.

Другая проблема, с которой я столкнулся, - это то, что если бы я упростил это до «стандартного именования php pear», так что, как кажется, эта тенденция создать класс, и он будет назван в честь его расположения:

var some_folder_name_class = function(){}

бы быть переведен автозагрузчиком как: some/folder/name/class.js, а затем загружает таким образом.

Чтобы обернуть и дойти до моей точки, есть два способа загрузки javascript-файла, на который я смотрю, используя собственный метод «require». Один из них загружает каталог javascript-файлов через хэш-идею, реализованную выше. (Предоставленный образец кода, как это хэш бы прошел через должны быть изменены и фиксированной .... Я не думаю, что это работает, чтобы даже загрузить один файл)

ИЛИ

иметь вас просто сделайте так:

new some_class_name() и иметь глобальную функцию слушать новое слово, найти файл, который вы пытаетесь вызвать, исходя из имени класса и загружать его, вам никогда не придется беспокоиться - пока вы следуете «Стандарты именования груши» в структуре классов и папок будет загружен ваш js-файл.

Можно ли сделать любой подход? или я мечтаю стать большим?

Я вижу много рамок сделать кучу require('/path/to/script') и если бы я мог роль моя автозагрузчика просто позвольте мне либо загрузить каталог JS-файлов или даже там, где он прослушивает new перед классом конкретизации, то я может облегчить мою жизнь.

ответ

2

Считаете ли вы использование requirejs и, возможно, Lazy загрузки.

http://www.joezimjs.com/javascript/lazy-loading-javascript-with-requirejs/

Вот образец версия:

  1. Вы можете скачать here.

  2. Пробу на основе этой структуры папок:

    общественного

    • index.html
    • скрипты

      • app.js
      • Lib

        ** JQuery-1.10.2.js

        ** require.js

3. Из Кодекса:

HTML

`<!DOCTYPE html><html> 
<head><title>Sample Test</title>` 

<script src="scripts/lib/require.js"></script> <!-- downloaded from link provide above--> <script src="scripts/app.js"></script></head>

`<body><h1>My Sample Project</h1><div id="someDiv"></div></body></html>` 

конфигурации приложения app.js

requirejs.config({ 
    baseUrl: 'scripts', 

    paths: { 
     app: 'app', 
     jquery: 'lib/jquery-1.10.2' //your libraries/modules definitions 
    } 
}); 

// Start the main app logic. loading jquery module 
require(['jquery'], function ($) { 
     $(document).on('ready',function(){ 
      $('#someDiv').html('Hello World'); 
     }); 
}); 
+0

Обратите внимание: (http://stackoverflow.com/questions/how-to-answer): * [Предоставить контекст для ссылок] Ссылка на потенциальное решение всегда приветствуется, но добавьте контекст вокруг ссылки, чтобы ваш другие пользователи будут иметь представление о том, что это такое и почему оно есть. Всегда указывайте наиболее значимую часть важной ссылки, если целевой сайт недоступен или постоянно находится в автономном режиме ». * –

2

JQuery-единственный вариант

Если вы ищете решение только для jQuery, взгляните на jQuery.getScript(). Это был бы отличный кандидат для обработки части загрузки скрипта вашей проблемы. Вы могли бы написать очень небольшую обертку вокруг него, чтобы загрузить все сценарии с чем-то, как вы писали выше:

var loadScripts = function(scripts) { 
    $.each(scripts, function(name, path) { 
    jQuery.getScript("/root/path/" + path + ".js"); 
    }) 
} 

Если вас интересует более подробная информация об этом подходе, read this article Дэвид Уолш.

Другие большие библиотеки

Я настоятельно рекомендую взглянуть на текущей партии сценария загрузки библиотек. Я думаю, что вы будете приятно удивлены тем, что там. Кроме того, они приходят с большой поддержкой сообщества и документацией. RequireJS кажется передним бегуном, но у Дэвида Уолша отличные статьи на curl.js и LABjs.

Смежные вопросы