Bir JavaScript dosyas─▒n─▒ ba┼čka bir JavaScript dosyas─▒na nas─▒l eklerim?


Al─▒nan cevaba git


JavaScriptÔÇÖte @import , CSSÔÇÖde oldu─ču gibi ba┼čka bir JavaScript dosyas─▒n─▒n i├žine bir JavaScript dosyas─▒ eklemenizi sa─člayan bir ┼čey var m─▒ ?


4845









Cevap say─▒s─▒n─▒ say: 30






Eski JavaScript s├╝r├╝mlerinde i├že aktarma, ekleme veya gereksinim yoktur, bu soruna ├žok farkl─▒ yakla┼č─▒mlar geli┼čtirilmi┼čtir.

Ancak, 2015'ten beri (ES6), JavaScript, ├žo─ču modern taray─▒c─▒ taraf─▒ndan da desteklenen Node.js'deki mod├╝lleri i├že aktarmak i├žin ES6 mod├╝lleri standard─▒na sahiptir .https://caniuse.com/%23feat%3Des6-module#feat=es6-module

Daha eski taray─▒c─▒larla uyumluluk i├žin derleme ve / veya aktarma ara├žlar─▒ kullan─▒labilir.

ES6 Mod├╝lleri

ECMAScript (ES6) mod├╝lleri Node.js'de v8.5'ten beri bayrakla desteklenmi┼čtir --experimental-modules . ─░lgili t├╝m dosyalar─▒n .mjs uzant─▒s─▒ olmal─▒d─▒r .

 // module.mjs
export function hello() {
  return "Hello";
}
 
 // main.mjs
import { hello } from 'module'; // or './module'
let val = hello();  // val is "Hello";
 

Taray─▒c─▒lardaki ECMAScript mod├╝lleri

Taray─▒c─▒lar (WebPack gibi hi├žbir alet gerekmez) do─črudan ECMAScript mod├╝llerini y├╝klemek i├žin destek oldu ├ž├╝nk├╝ Safari 10.1, Chrome 61, Firefox 60 ve Kenar 16'da ak─▒m deste─či edin caniuse .

 <script type="module">
  import { hello } from './hello.mjs';
  hello('world');
</script>
 
 // hello.mjs
export function hello(text) {
  const div = document.createElement('div');
  div.textContent = `Hello ${text}`;
  document.body.appendChild(div);
}
 

Https://jakearchibald.com/2017/es-modules-in-browsers/ adresinde daha fazla bilgi alabilirsiniz.https://jakearchibald.com/2017/es-modules-in-browsers/

Taray─▒c─▒larda dinamik ithalat

Dinamik i├že aktarma, komut dosyas─▒n─▒n gerekti─či gibi di─čer komut dosyalar─▒n─▒ da y├╝klemesini sa─člar:

 <script type="module">
  import('hello.mjs').then(module => {
      module.hello('world');
    });
</script>
 

Https://developers.google.com/web/updates/2017/11/dynamic-import adresinde daha fazla bilgi alabilirsiniz.https://developers.google.com/web/updates/2017/11/dynamic-import

Node.js gerektirir

Node.js'de hala yayg─▒n olarak kullan─▒lan eski mod├╝l alma tarz─▒ module.exports / request sistemidir.

 // mymodule.js
module.exports = {
   hello: function() {
      return "Hello";
   }
}
 
 // server.js
const myModule = require('./mymodule');
let val = myModule.hello(); // val is "Hello"   
 

JavaScript'in, ├Ân i┼čleme gerektirmeyen taray─▒c─▒lara harici JavaScript i├žerikleri eklemesinin ba┼čka yollar─▒ da vard─▒r.

AJAX Y├╝kleme

AJAX ├ža─čr─▒s─▒ ile ek bir komut dosyas─▒ y├╝kleyebilir ve daha sonra eval ├žal─▒┼čt─▒rmak i├žin kullanabilirsiniz . Bu en basit yoldur, ancak JavaScript sanal alan g├╝venlik modeli nedeniyle etki alan─▒n─▒zla s─▒n─▒rl─▒d─▒r. Kullan─▒lmas─▒ eval da b├Âcek, kesmek ve g├╝venlik konular─▒ kap─▒ a├žar.

Y├╝kleme Al

Dinamik ─░├že Aktarmalar gibi, bir veya daha fazla komut fetch dosyas─▒n─▒, Fetch Inject kitapl─▒─č─▒n─▒ kullanarak komut dosyas─▒ ba─č─▒ml─▒l─▒klar─▒ i├žin y├╝r├╝tme s─▒ras─▒n─▒ denetleme vaadi kullanarak bir ├ža─čr─▒ ile y├╝kleyebilirsiniz :

 fetchInject([
  'https://cdn.jsdelivr.net/momentjs/2.17.1/moment.min.js'
]).then(() => {
  console.log(`Finish in less than ${moment().endOf('year').fromNow(true)}`)
})
 

jQuery Y├╝kleniyor

JQuery k├╝t├╝phanesi y├╝kleme i┼člevi sa─člar tek sat─▒rda :

 $.getScript("my_lovely_script.js", function() {
   alert("Script loaded but not necessarily executed.");
});
 

Dinamik Betik Y├╝kleme

HTMLÔÇÖye komut dosyas─▒ URLÔÇÖsi i├žeren bir komut dosyas─▒ etiketi ekleyebilirsiniz. JQuery ek y├╝k├╝nden ka├ž─▒nmak i├žin bu ideal bir ├ž├Âz├╝md├╝r.

Betik farkl─▒ bir sunucuda bile bulunabilir. Ayr─▒ca, taray─▒c─▒ kodu de─čerlendirir. <script> Etiketi ya web sayfas─▒ i├žine enjekte edilebilir <head> , ya da sadece kapan─▒┼č ├Ân├╝ne eklenir </body> etiketi.

Bunun nas─▒l ├žal─▒┼čabilece─čine bir ├Ârnek:

 function dynamicallyLoadScript(url) {
    var script = document.createElement("script");  // create a script DOM node
    script.src = url;  // set its src to the provided URL

    document.head.appendChild(script);  // add it to the end of the head section of the page (could change 'head' to 'body' to add it to the end of the body section instead)
}
 

Bu i┼člev <script> , sayfan─▒n ba┼č k─▒sm─▒n─▒n sonuna, src ├Âzniteli─čin ilk parametre olarak i┼čleve verilen URL'ye ayarland─▒─č─▒ yeni bir etiket ekler .

Bu ├ž├Âz├╝mlerin her ikisi de JavaScript Madness: Dynamic Script Loading'da tart─▒┼č─▒lmakta ve g├Âsterilmektedir .

Komut dosyas─▒n─▒n ne zaman y├╝r├╝t├╝ld├╝─č├╝n├╝ alg─▒lama

┼×imdi, bilmeniz gereken b├╝y├╝k bir sorun var. Bunu yapmak , kodu uzaktan y├╝kledi─činiz anlam─▒na gelir . Modern web taray─▒c─▒lar─▒ dosyay─▒ y├╝kler ve mevcut beti─činizi ├žal─▒┼čt─▒rmaya devam eder, ├ž├╝nk├╝ performans─▒ geli┼čtirmek i├žin her ┼čeyi zaman uyumsuz olarak y├╝klerler. (Bu hem jQuery y├Ântemi hem de manuel dinamik komut dosyas─▒ y├╝kleme y├Ântemi i├žin ge├žerlidir.)

Bu hileleri do─črudan kullan─▒rsan─▒z, yeni y├╝klenen kodunuzu, y├╝klenmesini istedikten sonraki sat─▒rda kullanamayaca─č─▒n─▒z anlam─▒na gelir , ├ž├╝nk├╝ y├╝klenmeye devam eder.

├ľrne─čin: my_lovely_script.js i├žerir MySuperObject :

 var js = document.createElement("script");

js.type = "text/javascript";
js.src = jsFilePath;

document.body.appendChild(js);

var s = new MySuperObject();

Error : MySuperObject is undefined
 

Sonra isabet eden sayfay─▒ yeniden y├╝klersiniz F5. Ve ├žal─▒┼č─▒yor! Kafa kar─▒┼čt─▒r─▒c─▒...

Peki bu konuda ne yapmal─▒?

Pekala, yazar─▒n size verdi─čim ba─člant─▒da ├Ânerdi─či hack'├╝ kullanabilirsiniz. ├ľzet olarak, acele eden insanlar i├žin, komut dosyas─▒ y├╝klendi─činde bir geri ├ža─č─▒rma i┼člevini ├žal─▒┼čt─▒rmak i├žin bir olay kullan─▒r. B├Âylece geri arama i┼člevindeki uzak k├╝t├╝phaneyi kullanarak t├╝m kodu koyabilirsiniz. ├ľrne─čin:

 function loadScript(url, callback)
{
    // Adding the script tag to the head as suggested before
    var head = document.head;
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;

    // Then bind the event to the callback function.
    // There are several events for cross browser compatibility.
    script.onreadystatechange = callback;
    script.onload = callback;

    // Fire the loading
    head.appendChild(script);
}
 

Daha sonra kullanmak istedi─činiz kodu yazd─▒ktan sonra script bir lambda i┼člevine y├╝klenir :

 var myPrettyCode = function() {
   // Here, do whatever you want
};
 

Sonra hepsini sen i┼čletiyorsun:

 loadScript("my_lovely_script.js", myPrettyCode);
 

Komut dosyas─▒n─▒n DOM y├╝klendikten sonra veya taray─▒c─▒ya ba─čl─▒ olarak ve sat─▒r─▒n dahil edilip edilmedi─čine ba─čl─▒ olarak ├žal─▒┼čabilece─čini unutmay─▒n script.async = false; . Bir var genel JavaScript y├╝kleme b├╝y├╝k makale bu anlat─▒l─▒r.

Kaynak Kod Birle┼čtirme / ├ľn ─░┼čleme

Bu cevab─▒n ba┼č─▒nda da belirtildi─či gibi, bir├žok geli┼čtirici projelerinde Parcel, Webpack veya Babel gibi derleme / aktarma ara├žlar─▒n─▒ kullanmaktad─▒r. kod b├Âlme i┼člemi ger├žekle┼čtirme vb.


4208







Herhangi biri daha geli┼čmi┼č bir ┼čey ar─▒yorsa, RequireJS'i deneyin . Ba─č─▒ml─▒l─▒k y├Ânetimi, daha iyi e┼čzamanl─▒l─▒k ve yinelenmekten ka├ž─▒nmak gibi ek avantajlar elde edersiniz (yani bir komut dosyas─▒n─▒ bir kereden fazla almak).

JavaScript dosyalar─▒n─▒z─▒ "mod├╝ller" olarak yazabilir ve ard─▒ndan di─čer komut dosyalar─▒ndaki ba─č─▒ml─▒l─▒klar olarak ba┼čvurabilirsiniz. Veya RequireJS'i basit bir "git bu komut dosyas─▒n─▒ al" ├ž├Âz├╝m├╝ olarak kullanabilirsiniz.

├ľrnek:

Ba─č─▒ml─▒l─▒klar─▒ mod├╝ller olarak tan─▒mlay─▒n:

Baz─▒-dependency.js

 define(['lib/dependency1', 'lib/dependency2'], function (d1, d2) {

     //Your actual script goes here.   
     //The dependent scripts will be fetched if necessary.

     return libraryObject;  //For example, jQuery object
});
 

implementation.js ba─čl─▒d─▒r "ana" JavaScript dosyas─▒ olan baz─▒-dependency.js

 require(['some-dependency'], function(dependency) {

    //Your script goes here
    //some-dependency.js is fetched.   
    //Then your script is executed
});
 

GitHub README'den bir al─▒nt─▒ :

RequireJS, d├╝z JavaScript dosyalar─▒n─▒ ve daha tan─▒mlanm─▒┼č mod├╝lleri y├╝kler. Bir Web ├çal─▒┼čan─▒ dahil taray─▒c─▒ i├ži kullan─▒m i├žin optimize edilmi┼čtir, ancak Rhino ve Node gibi di─čer JavaScript ortamlar─▒nda da kullan─▒labilir. E┼čzamans─▒z Mod├╝l API'sini uygular.

RequireJS, mod├╝lleri / dosyalar─▒ y├╝klemek i├žin d├╝z kod etiketleri kullan─▒r, bu y├╝zden kolay hata ay─▒klamaya izin vermelidir. Var olan JavaScript dosyalar─▒n─▒ y├╝klemek i├žin kullan─▒labilir, b├Âylece JavaScript dosyalar─▒n─▒z─▒ yeniden yazmak zorunda kalmadan mevcut projenize ekleyebilirsiniz.

...


553







Orada asl─▒nda olan bir JavaScript dosyas─▒ y├╝klemek i├žin bir yol de─čil bunu y├╝klenmesinden sonra yeni y├╝klenen dosya sa─č dahil fonksiyonlar─▒n─▒ kullanabilir, b├Âylece uyumsuz ve bunu t├╝m taray─▒c─▒larda ├žal─▒┼č─▒r d├╝┼č├╝n├╝yorum.

Sen kullanmak gerekir jQuery.append() ├╝zerinde <head> sayfan─▒z─▒n eleman─▒, yani:

 $("head").append('<script type="text/javascript" src="' + script + '"></script>');
 

Ancak, bu y├Ântemin de sorunu var: Al─▒nan JavaScript dosyas─▒nda bir hata olursa, Firebug (ve ayr─▒ca Firefox Hata Konsolu ve Chrome Geli┼čtirici Ara├žlar─▒ ) da hatal─▒ bir ┼čekilde rapor verecek ve Firebug kullan─▒yorsan─▒z b├╝y├╝k bir sorun olacak. JavaScript hatalar─▒ ├žok a┼ča─č─▒ (ben yapar─▒m). Firebug bir nedenden dolay─▒ yeni y├╝klenen dosya hakk─▒nda bir ┼čey bilmiyor, bu nedenle bu dosyada bir hata meydana gelirse, ana HTML dosyan─▒zda meydana geldi─čini bildirir ve hatan─▒n ger├žek nedenini bulmakta zorluk ├žekersiniz.

Fakat bu sizin i├žin bir sorun de─čilse, o zaman bu y├Ântem i┼če yaramal─▒.

Asl─▒nda bu y├Ântemi kullanan $ .import_js () ad─▒nda bir jQuery eklentisi yazd─▒m :

 (function($)
{
    /*
     * $.import_js() helper (for JavaScript importing within JavaScript code).
     */
    var import_js_imported = [];

    $.extend(true,
    {
        import_js : function(script)
        {
            var found = false;
            for (var i = 0; i < import_js_imported.length; i++)
                if (import_js_imported[i] == script) {
                    found = true;
                    break;
                }

            if (found == false) {
                $("head").append('<script type="text/javascript" src="' + script + '"></script>');
                import_js_imported.push(script);
            }
        }
    });

})(jQuery);
 

Yani JavaScript'i i├že aktarmak i├žin yapman─▒z gereken tek ┼čey:

 $.import_js('/path_to_project/scripts/somefunctions.js');
 

Ben ayr─▒ca bunun i├žin basit bir test yap─▒lm─▒┼č ├ľrnek .

main.js Ana HTML'de bir dosya i├žerir ve ard─▒ndan bu i┼člevi tan─▒mlayan ek bir dosyay─▒ almak i├žin main.js kullan─▒lan komut dosyas─▒ kullan─▒l─▒r : $.import_js() included.js

 function hello()
{
    alert("Hello world!");
}
 

Dahil ettikten hemen sonra included.js , hello() i┼člev ├ža─čr─▒l─▒r ve uyar─▒ verilir.

(Bu cevap e-satis'un yorumuna cevap olarak verilmi┼čtir).


185







Bir ba┼čka yol, bence ├žok daha temiz, bir <script> etiket kullanmak yerine senkronize bir Ajax talebi yapmak . Ayn─▒ zamanda Node.js i┼čleyi┼čini de i├žerir.

─░┼čte jQuery kullanarak bir ├Ârnek:

 function require(script) {
    $.ajax({
        url: script,
        dataType: "script",
        async: false,           // <-- This is the key
        success: function () {
            // all good...
        },
        error: function () {
            throw new Error("Could not load script " + script);
        }
    });
}
 

Daha sonra genellikle bir i├žerme kulland─▒─č─▒n─▒z gibi kodunuzda kullanabilirsiniz:

 require("/scripts/subscript.js");
 

Ve bir sonraki sat─▒rda gerekli beti─čin bir i┼člevini ├ža─č─▒rabilir:

 subscript.doSomethingCool(); 
 

145







Senin i├žin iyi bir haber var. ├çok yak─▒nda kolayca JavaScript kodunu y├╝klemek m├╝mk├╝n olacak. JavaScript kod mod├╝llerini i├že aktarman─▒n standart bir yolu olacak ve temel JavaScript'in bir par├žas─▒ olacakt─▒r.

Dosyadan import cond from 'cond.js'; adland─▒r─▒lm─▒┼č bir makroyu y├╝klemek i├žin yazman─▒z yeterlidir . cond cond.js

Yani herhangi bir JavaScript ├žer├ževesine g├╝venmek zorunda de─čilsiniz ve a├ž─▒k├ža Ajax ├ža─čr─▒lar─▒ yapmak zorunda de─čilsiniz .

Bak─▒n─▒z:


95







Bir JavaScript etiketi dinamik olarak olu┼čturmak ve onu di─čer JavaScript kodunun i├žinden HTML belgesine eklemek m├╝mk├╝nd├╝r. Bu hedeflenen JavaScript dosyas─▒n─▒ y├╝kleyecektir.

 function includeJs(jsFilePath) {
    var js = document.createElement("script");

    js.type = "text/javascript";
    js.src = jsFilePath;

    document.body.appendChild(js);
}

includeJs("/path/to/some/file.js");
 

85







A├ž─▒klama import ECMAScript 6'dad─▒r.

S├Âzdizimi

 import name from "module-name";
import { member } from "module-name";
import { member as alias } from "module-name";
import { member1 , member2 } from "module-name";
import { member1 , member2 as alias2 , [...] } from "module-name";
import name , { member [ , [...] ] } from "module-name";
import "module-name" as name;
 

67







Belki bu sayfada buldu─čum bu i┼člevi kullanabilirsiniz. JavaScript dosyas─▒na bir JavaScript dosyas─▒n─▒ nas─▒l eklerim? :

 function include(filename)
{
    var head = document.getElementsByTagName('head')[0];

    var script = document.createElement('script');
    script.src = filename;
    script.type = 'text/javascript';

    head.appendChild(script)
}
 

56







─░┼čte jQuery olmadan senkronize bir versiyonu :

 function myRequire( url ) {
    var ajax = new XMLHttpRequest();
    ajax.open( 'GET', url, false ); // <-- the 'false' makes it synchronous
    ajax.onreadystatechange = function () {
        var script = ajax.response || ajax.responseText;
        if (ajax.readyState === 4) {
            switch( ajax.status) {
                case 200:
                    eval.apply( window, [script] );
                    console.log("script loaded: ", url);
                    break;
                default:
                    console.log("ERROR: script not loaded: ", url);
            }
        }
    };
    ajax.send(null);
}
 

Bu ├žal─▒┼čma ├žapraz etki alan─▒n─▒ almak i├žin, sunucunun allow-origin yan─▒t─▒n─▒ ├╝stbilgiye koymas─▒ gerekece─čini unutmay─▒n .


49







Ben sadece bu JavaScript kodunu yazd─▒m ( DOM manip├╝lasyonu i├žin Prototip kullanarak ):http://en.wikipedia.org/wiki/Document_Object_Model

 var require = (function() {
    var _required = {};
    return (function(url, callback) {
        if (typeof url == 'object') {
            // We've (hopefully) got an array: time to chain!
            if (url.length > 1) {
                // Load the nth file as soon as everything up to the
                // n-1th one is done.
                require(url.slice(0, url.length - 1), function() {
                    require(url[url.length - 1], callback);
                });
            } else if (url.length == 1) {
                require(url[0], callback);
            }
            return;
        }
        if (typeof _required[url] == 'undefined') {
            // Haven't loaded this URL yet; gogogo!
            _required[url] = [];

            var script = new Element('script', {
                src: url,
                type: 'text/javascript'
            });
            script.observe('load', function() {
                console.log("script " + url + " loaded.");
                _required[url].each(function(cb) {
                    cb.call(); // TODO: does this execute in the right context?
                });
                _required[url] = true;
            });

            $$('head')[0].insert(script);
        } else if (typeof _required[url] == 'boolean') {
            // We already loaded the thing, so go ahead.
            if (callback) {
                callback.call();
            }
            return;
        }

        if (callback) {
            _required[url].push(callback);
        }
    });
})();
 

Kullan─▒m─▒:

 <script src="prototype.js"></script>
<script src="require.js"></script>
<script>
    require(['foo.js','bar.js'], function () {
        /* Use foo.js and bar.js here */
    });
</script>
 

Gist: http://gist.github.com/284442 .


45







─░┼čte Facebook her yerde Be─čen d├╝─čmesi i├žin nas─▒l yapt─▒─č─▒ genelle┼čtirilmi┼č versiyonu:

 <script>
  var firstScript = document.getElementsByTagName('script')[0],
      js = document.createElement('script');
  js.src = 'https://cdnjs.cloudflare.com/ajax/libs/Snowstorm/20131208/snowstorm-min.js';
  js.onload = function () {
    // do stuff with your dynamically loaded script
    snowStorm.snowColor = '#99ccff';
  };
  firstScript.parentNode.insertBefore(js, firstScript);
</script> 

Facebook i├žin ├žal─▒┼č─▒yorsa, sizin i├žin ├žal─▒┼čacakt─▒r.

Bunun script yerine ilk eleman─▒ aramam─▒z─▒n sebebi head ya body da baz─▒ taray─▒c─▒lar─▒n eksikse bir tane yaratmamas─▒d─▒r, ancak bir script eleman─▒n olmas─▒ garantidir - bu. Http://www.jspatterns.com/the-ridiculous-case-of-adding-a-script-element/ adresinde daha fazla bilgi bulabilirsiniz .


40







Saf JavaScript'te istiyorsan─▒z, kullanabilirsiniz document.write .

 document.write('<script src="myscript.js" type="text/javascript"></script>');
 

JQuery k├╝t├╝phanesini kullan─▒yorsan─▒z, $.getScript y├Ântemi kullanabilirsiniz .

 $.getScript("another_script.js");
 

35







PHP kullanarak komut dosyalar─▒n─▒z─▒ da birle┼čtirebilirsiniz :

Dosya main.js.php :

 <?php
    header('Content-type:text/javascript; charset=utf-8');
    include_once("foo.js.php");
    include_once("bar.js.php");
?>

// Main JavaScript code goes here
 

27







Burada g├Âsterilen ├ž├Âz├╝mlerin ├žo─ču, dinamik y├╝kleme anlam─▒na gelir. Bunun yerine, t├╝m ba─čl─▒ dosyalar─▒ tek bir ├ž─▒kt─▒ dosyas─▒na birle┼čtiren bir derleyici ar─▒yordum. Less / Sass ├Âni┼člemcileri ile ayn─▒ @import kural ile CSS ile ilgilenir . Bu t├╝rden iyi bir ┼čey bulamad─▒─č─▒m i├žin sorunu ├ž├Âzen basit bir ara├ž yazd─▒m.

Yani burada derleyici, https://github.com/dsheiko/jsic , $import("file-path") istenen dosya i├žeri─čiyle g├╝venli bir ┼čekilde de─či┼čtiriyor. ─░┼čte kar┼č─▒l─▒k gelen Grunt eklentisi: https://github.com/dsheiko/grunt-jsic .

JQuery ana dal─▒nda, atom kaynak dosyalar─▒n─▒ basit├že ile ba┼člayan intro.js ve biten tek bir dosyada birle┼čtirirler outtro.js . Kaynak kod tasar─▒m─▒ konusunda esneklik sa─člamad─▒─č─▒ i├žin bu bana uygun de─čil. Jsic ile nas─▒l ├žal─▒┼čt─▒─č─▒n─▒ kontrol edin:

src / main.js

 var foo = $import("./Form/Input/Tel");
 

src / Form / giri┼č / Tel.js

 function() {
    return {
          prop: "",
          method: function(){}
    }
}
 

┼×imdi derleyiciyi ├žal─▒┼čt─▒rabiliriz:

 node jsic.js src/main.js build/mail.js
 

Ve birle┼čtirilmi┼č dosyay─▒ al

build / main.js

 var foo = function() {
    return {
          prop: "",
          method: function(){}
    }
};
 

26







JavaScript dosyas─▒n─▒ y├╝klemek istedi─činizde i├žeri / d─▒┼čar─▒ aktar─▒lan dosyadaki i┼člevleri kullan─▒yorsan─▒z, genel bir nesneyi tan─▒mlayabilir ve i┼člevleri nesne ├Â─čeleri olarak ayarlayabilirsiniz. ├ľrne─čin:

global.js

 A = {};
 

file1.js

 A.func1 = function() {
  console.log("func1");
}
 

file2.js

 A.func2 = function() {
  console.log("func2");
}
 

main.js

 A.func1();
A.func2();
 

Bir HTML dosyas─▒na komut dosyalar─▒ dahil ederken sadece dikkatli olman─▒z gerekir. Sipari┼č a┼ča─č─▒daki gibi olmal─▒d─▒r:

 <head>
  <script type="text/javascript" src="global.js"></script>
  <script type="text/javascript" src="file1.js"></script>
  <script type="text/javascript" src="file2.js"></script>
  <script type="text/javascript" src="main.js"></script>
</head>
 

22







Bu yapmal─▒:

 xhr = new XMLHttpRequest();
xhr.open("GET", "/soap/ajax/11.0/connection.js", false);
xhr.send();
eval(xhr.responseText);
 

20







Veya ├žal─▒┼čma zaman─▒nda eklemek yerine, y├╝klemeden ├Ânce birle┼čtirmek i├žin bir komut dosyas─▒ kullan─▒n.

Kulland─▒─č─▒m di┼člisi (ba┼čkalar─▒ da varsa bilmiyorum). JavaScript kodunuzu ayr─▒ dosyalar halinde olu┼čturuyorsunuz ve Sprockets motoru taraf─▒ndan i┼člendi─či yorumlar─▒ dahil ediyorsunuz. Geli┼čtirme i├žin dosyalar─▒ s─▒rayla, ard─▒ndan prod├╝ksiyon i├žin birle┼čtirmek i├žin ...

Ayr─▒ca bak─▒n─▒z:


19







Basit bir sorun ya┼čad─▒m, ancak bu soruya verdi─čim cevaplar kar┼č─▒s─▒nda ┼ča┼čk─▒nl─▒─ča u─črad─▒m.

Bir JavaScript dosyas─▒nda (myvariables.js) tan─▒mlanan bir de─či┼čkeni (myVar1) ba┼čka bir JavaScript dosyas─▒nda (main.js) kullanmak zorunda kald─▒m.

Bunun i├žin a┼ča─č─▒daki gibi yapt─▒m:

JavaScript kodunu HTML dosyas─▒na, do─čru s─▒rayla ├Ânce myvariables.js, daha sonra main.js dosyas─▒n─▒ y├╝kledi:

 <html>
    <body onload="bodyReady();" >

        <script src="myvariables.js" > </script>
        <script src="main.js" > </script>

        <!-- Some other code -->
    </body>
</html>
 

Dosya: myvariables.js

 var myVar1 = "I am variable from myvariables.js";
 

Dosya: main.js

 // ...
function bodyReady() {
    // ...
    alert (myVar1);    // This shows "I am variable from myvariables.js", which I needed
    // ...
}
// ...
 

G├Ârd├╝─č├╝n├╝z gibi, bir JavaScript dosyas─▒ndaki bir de─či┼čkeni ba┼čka bir JavaScript dosyas─▒nda kulland─▒m, ancak birini di─čerine eklememe gerek yoktu. ─░lk JavaScript dosyas─▒n─▒n ikinci JavaScript dosyas─▒ndan ├Ânce y├╝klendi─činden ve ilk JavaScript dosyas─▒n─▒n de─či┼čkenlerinin ikinci JavaScript dosyas─▒nda otomatik olarak eri┼čilebilir oldu─čundan emin olmam gerekiyordu.

Bu g├╝n├╝m├╝ kurtard─▒. Umar─▒m bu yard─▒mc─▒ olur.


15







E─čer kulland─▒─č─▒n─▒z Web Workers ve i┼č├žinin kapsam─▒nda ek komut dosyalar─▒ eklemek istedi─činiz, di─čer cevaplar i├žin komut dosyalar─▒ ekleme hakk─▒nda verilen head sizin i├žin ├žal─▒┼čmaz vb etiketi.

Neyse ki, Web ─░┼č├žileri kendi sahip importScripts i┼člevini o kadar kendisi taray─▒c─▒ yerli Web Worker kapsam─▒nda global bir fonksiyondur ├Âzelli─činin bir par├žas─▒d─▒r .

Alternatif olarak, sorunuza en y├╝ksek oyu alan ikinci cevab─▒n vurguland─▒─č─▒ gibi , RequireJS ayr─▒ca bir Web ├çal─▒┼čan─▒ i├žerisindeki komut dosyalar─▒n─▒ da i├žerebilir (b├╝y├╝k olas─▒l─▒kla importScripts kendisini ├ža─č─▒r─▒yor , ancak birka├ž faydal─▒ ├Âzellik daha var).


15







@import JavaScript CSS benzeri ithal ula┼čmak i├žin s├Âzdizimi b├Âyle kendi ├Âzel arac─▒l─▒─č─▒yla Kar─▒┼č─▒m─▒ gibi bir ara├ž kullanarak m├╝mk├╝nd├╝r .mix (bkz dosya t├╝r├╝ne burada ). Uygulaman─▒n bilmedi─čim halde yukar─▒da belirtilen y├Ântemlerden birini kulland─▒─č─▒n─▒ d├╝┼č├╝n├╝yorum.

.mix Dosyalar ├╝zerindeki Kar─▒┼č─▒m dok├╝mantasyonundan :

Mix dosyalar─▒ basit├že .js veya .css'dir. dosya ad─▒na. Bir kar─▒┼č─▒m dosyas─▒, normal bir stil veya komut dosyas─▒n─▒n i┼člevselli─čini geni┼čletir ve i├že aktarman─▒z─▒ ve birle┼čtirmenizi sa─člar.

─░┼čte .mix birden fazla .js dosyay─▒ tek bir dosyada birle┼čtiren ├Ârnek bir dosya :

 // scripts-global.mix.js
// Plugins - Global

@import "global-plugins/headroom.js";
@import "global-plugins/retina-1.1.0.js";
@import "global-plugins/isotope.js";
@import "global-plugins/jquery.fitvids.js";
 

Kar─▒┼č─▒m, bunun yan─▒ scripts-global.js s─▒ra k├╝├ž├╝lt├╝lm├╝┼č bir s├╝r├╝m ( scripts-global.min.js ) olarak da ├ž─▒kt─▒ verir.

Not: Herhangi bir ┼čekilde Mixture'ye ba─čl─▒ de─čilim, onu bir ├Ân u├ž geli┼čtirme arac─▒ olarak kullanmak d─▒┼č─▒nda. Bir .mix JavaScript dosyas─▒n─▒ ├žal─▒┼č─▒rken (Kar─▒┼č─▒m kazanlar─▒ndan birinde) ve biraz kar─▒┼čt─▒─č─▒nda (ÔÇťbunu yapabilir misin?ÔÇŁ Diye d├╝┼č├╝nd├╝m) bu soruyla kar┼č─▒la┼čt─▒m . Sonra uygulamaya ├Âzel bir dosya t├╝r├╝ oldu─čunu anlad─▒m (biraz hayal k─▒r─▒kl─▒─č─▒ yaratt─▒, anla┼čt─▒m). Bununla birlikte, bilginin ba┼čkalar─▒ i├žin faydal─▒ olabilece─čini d├╝┼č├╝nd├╝m.

G├ťNCELLEME : Kar─▒┼č─▒m art─▒k ├╝cretsiz (├ževrimd─▒┼č─▒).

G├ťNCELLEME : Kar─▒┼č─▒m art─▒k ├╝retilmiyor. Eski kar─▒┼č─▒m s├╝r├╝mleri hala mevcuttur


13







Her zamanki y├Ântemim:

 var require = function (src, cb) {
    cb = cb || function () {};

    var newScriptTag = document.createElement('script'),
        firstScriptTag = document.getElementsByTagName('script')[0];
    newScriptTag.src = src;
    newScriptTag.async = true;
    newScriptTag.onload = newScriptTag.onreadystatechange = function () {
        (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') && (cb());
    };
    firstScriptTag.parentNode.insertBefore(newScriptTag, firstScriptTag);
}
 

Harika ├žal─▒┼č─▒yor ve benim i├žin sayfa y├╝klemesi kullanm─▒yor. AJAX y├Ântemini (di─čer cevaplardan biri) denedim ama bu benim i├žin iyi i┼č gibi g├Âr├╝nm├╝yor.

─░┼čte kod merakl─▒ olanlar i├žin nas─▒l ├žal─▒┼čt─▒─č─▒n─▒ bir a├ž─▒klama: esas olarak, URL'nin yeni bir komut dosyas─▒ etiketi (ilkinden sonra) olu┼čturur. E┼čzamans─▒z moda ayarlar, b├Âylece kodun geri kalan─▒n─▒ engellemez, ancak readyState (y├╝klenecek i├žeri─čin durumu) 'y├╝kl├╝' olarak de─či┼čti─činde geri ├ža─čr─▒ ├ža─č─▒r─▒r.


12







 var js = document.createElement("script");

js.type = "text/javascript";
js.src = jsFilePath;

document.body.appendChild(js);
 

11







JavaScript'te mod├╝l komut dosyalar─▒n─▒ alma / ekleme i┼čini otomatikle┼čtiren basit bir mod├╝l yazd─▒m. Kodun ayr─▒nt─▒l─▒ a├ž─▒klamas─▒ i├žin, JavaScript gerektiren / i├že aktarma / dahil etme mod├╝llerinin blog g├Ânderisine bak─▒n .

 // ----- USAGE -----

require('ivar.util.string');
require('ivar.net.*');
require('ivar/util/array.js');
require('http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js');

ready(function(){
    //Do something when required scripts are loaded
});

    //--------------------

var _rmod = _rmod || {}; //Require module namespace
_rmod.LOADED = false;
_rmod.on_ready_fn_stack = [];
_rmod.libpath = '';
_rmod.imported = {};
_rmod.loading = {
    scripts: {},
    length: 0
};

_rmod.findScriptPath = function(script_name) {
    var script_elems = document.getElementsByTagName('script');
    for (var i = 0; i < script_elems.length; i++) {
        if (script_elems[i].src.endsWith(script_name)) {
            var href = window.location.href;
            href = href.substring(0, href.lastIndexOf('/'));
            var url = script_elems[i].src.substring(0, script_elems[i].length - script_name.length);
            return url.substring(href.length+1, url.length);
        }
    }
    return '';
};

_rmod.libpath = _rmod.findScriptPath('script.js'); //Path of your main script used to mark
                                                   //the root directory of your library, any library.


_rmod.injectScript = function(script_name, uri, callback, prepare) {

    if(!prepare)
        prepare(script_name, uri);

    var script_elem = document.createElement('script');
    script_elem.type = 'text/javascript';
    script_elem.title = script_name;
    script_elem.src = uri;
    script_elem.async = true;
    script_elem.defer = false;

    if(!callback)
        script_elem.onload = function() {
            callback(script_name, uri);
        };
    document.getElementsByTagName('head')[0].appendChild(script_elem);
};

_rmod.requirePrepare = function(script_name, uri) {
    _rmod.loading.scripts[script_name] = uri;
    _rmod.loading.length++;
};

_rmod.requireCallback = function(script_name, uri) {
    _rmod.loading.length--;
    delete _rmod.loading.scripts[script_name];
    _rmod.imported[script_name] = uri;

    if(_rmod.loading.length == 0)
        _rmod.onReady();
};

_rmod.onReady = function() {
    if (!_rmod.LOADED) {
        for (var i = 0; i < _rmod.on_ready_fn_stack.length; i++){
            _rmod.on_ready_fn_stack[i]();
        });
        _rmod.LOADED = true;
    }
};

_.rmod = namespaceToUri = function(script_name, url) {
    var np = script_name.split('.');
    if (np.getLast() === '*') {
        np.pop();
        np.push('_all');
    }

    if(!url)
        url = '';

    script_name = np.join('.');
    return  url + np.join('/')+'.js';
};

//You can rename based on your liking. I chose require, but it
//can be called include or anything else that is easy for you
//to remember or write, except "import", because it is reserved
//for future use.
var require = function(script_name) {
    var uri = '';
    if (script_name.indexOf('/') > -1) {
        uri = script_name;
        var lastSlash = uri.lastIndexOf('/');
        script_name = uri.substring(lastSlash+1, uri.length);
    } 
    else {
        uri = _rmod.namespaceToUri(script_name, ivar._private.libpath);
    }

    if (!_rmod.loading.scripts.hasOwnProperty(script_name)
     && !_rmod.imported.hasOwnProperty(script_name)) {
        _rmod.injectScript(script_name, uri,
            _rmod.requireCallback,
                _rmod.requirePrepare);
    }
};

var ready = function(fn) {
    _rmod.on_ready_fn_stack.push(fn);
};
 

11







Modern dilde olur

 function loadJs( url ){
  return new Promise( resolve => {
    const script = document.createElement( "script" );
    script.src = url;
    script.onload = resolve;
    document.head.appendChild( script );
  });
}
 

11







Bu komut dosyas─▒, ba┼čka bir <script> etiketin en ├╝st├╝ne bir JavaScript dosyas─▒ ekler :

 (function () {
    var li = document.createElement('script'); 
    li.type = 'text/javascript'; 
    li.src= "http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"; 
    li.async=true; 
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(li, s);
})();
 

9







Head.js de var . Ba┼ča ├ž─▒kmak ├žok kolayd─▒r:

 head.load("js/jquery.min.js",
          "js/jquery.someplugin.js",
          "js/jquery.someplugin.css", function() {
  alert("Everything is ok!");
});
 

G├Ârd├╝─č├╝n├╝z gibi, Require.js'den daha kolay ve jQuery'nin $.getScript y├Ântemi kadar uygun . Ayr─▒ca ┼čartl─▒ y├╝kleme, ├Âzellik alg─▒lama ve ├žok daha fazlas─▒ gibi baz─▒ geli┼čmi┼č ├Âzelliklere de sahiptir .


9


2013-11-22





Bu soruya geldim, ├ž├╝nk├╝ faydal─▒ JavaScript eklentileri koleksiyonunu koruman─▒n basit bir yolunu ar─▒yordum. Buradaki baz─▒ ├ž├Âz├╝mleri g├Ârd├╝kten sonra, ┼čunu buldum:

  1. "Plugins.js" (veya extensions.js ya da sahip oldu─čunuz) bir dosya kurun. Eklenti dosyalar─▒n─▒z─▒ bir ana dosya ile birlikte tutun.

  2. plugins.js, her biri () ├╝zerinde yineleyece─čimiz "pluginNames []" adl─▒ bir diziye sahip olacak ve daha sonra her bir eklentinin ba┼č─▒na bir etiket ekleyecektir.

    // Eklenti dosyalar─▒ ekledi─čimizde veya kald─▒rd─▒─č─▒m─▒zda g├╝ncellenecek diziyi ayarlay─▒n var pluginNames = ["lettering", "fittext", "butterjam", vs.]; // her eklenti i├žin bir script etiketi $ .each (pluginNames, function () {$ ('head'). append ('');});

  3. kafan─▒zdaki yaln─▒zca bir dosyay─▒ elle aray─▒n:
    <script src="js/plugins/plugins.js"></script>

T├╝m eklentiler ba┼č etiketine gerekti─či gibi b─▒rak─▒lsalar da, sayfaya t─▒klad─▒─č─▒n─▒zda ya da yeniledi─činizde her zaman taray─▒c─▒ taraf─▒ndan ├žal─▒┼čt─▒r─▒lmad─▒klar─▒n─▒ ├Â─črendim.

Ben sadece bir PHP dahil komut dosyas─▒ etiketleri yazmak i├žin daha g├╝venilir buldum. Sadece bir kez yazmak zorundas─▒n─▒z ve bu sadece JavaScript kullanarak eklentiyi ├ža─č─▒rmak kadar i┼če yar─▒yor.


9







Bu soru i├žin ├žok fazla potansiyel cevap var. Cevab─▒m belli ki bir ka├ž─▒n─▒ temel al─▒yor. T├╝m cevaplar─▒ okuduktan sonra sona erdi.

$.getScript Y├╝kleme tamamland─▒─č─▒nda geri arama gerektiren ve ger├žekten ba┼čka herhangi bir ├ž├Âz├╝mle ilgili sorun, onu kullanan birden fazla dosyan─▒z varsa ve birbirlerine ba─čl─▒ysa, art─▒k t├╝m komut dosyalar─▒n─▒n ne zaman y├╝klendi─čini bilmenin bir yolu yoktur. birden fazla dosyada).

├ľrnek:

file3.js

 var f3obj = "file3";

// Define other stuff
 

file2.js:

 var f2obj = "file2";
$.getScript("file3.js", function(){

    alert(f3obj);

    // Use anything defined in file3.
});
 

file1.js:

 $.getScript("file2.js", function(){
    alert(f3obj); //This will probably fail because file3 is only guaranteed to have loaded inside the callback in file2.
    alert(f2obj);

    // Use anything defined in the loaded script...
});
 

E┼čzamanl─▒ olarak ├žal─▒┼čmak veya XMLHttpRequest kullanmak i├žin Ajax belirleyebilece─činizi s├Âylerken hakl─▒s─▒n─▒z , ancak mevcut e─čilim, senkronize istekleri kullan─▒mdan kald─▒r─▒yor gibi g├Âr├╝n├╝yor, bu y├╝zden ┼čimdi ya da gelecekte tam taray─▒c─▒ deste─či alamayabilirsiniz.

$.when Ertelenen nesnelerin bir dizisini kontrol etmeyi deneyebilirsiniz , ancak ┼čimdi bunu her dosyada yap─▒yorsunuz ve dosya2 $.when , geri arama y├╝r├╝t├╝ld├╝─č├╝nde de─čil y├╝r├╝t├╝ld├╝─č├╝ anda y├╝klenmi┼č say─▒l─▒yor , bu nedenle dosya1, dosya3 y├╝klenmeden ├Ânce y├╝r├╝tmeye devam ediyor . Bu hala ayn─▒ sorun var.

─░leriye do─čru geriye gitmeye karar verdim. Te┼čekk├╝r ederim document.writeln . Tabu oldu─čunu biliyorum, ama do─čru kullan─▒ld─▒─č─▒ s├╝rece bu iyi ├žal─▒┼č─▒yor. Kolayca hata ay─▒klanabilen, DOMÔÇÖda do─čru ┼čekilde g├Âsterilen ve ba─č─▒ml─▒l─▒klar─▒n do─čru bir ┼čekilde y├╝klenme s─▒ras─▒n─▒ sa─člayabilece─činiz bir kod ile bitirdiniz.

Elbette $ ("body"). Append () kullanabilirsiniz, ancak daha sonra art─▒k do─čru ┼čekilde hata ay─▒klayamazs─▒n─▒z.

NOT: Bunu yaln─▒zca sayfa y├╝klenirken kullanman─▒z gerekir, aksi takdirde bo┼č bir ekran g├Âr├╝rs├╝n├╝z. Ba┼čka bir deyi┼čle, bunu her zaman belgenin ├Ân├╝ne / d─▒┼č─▒na yerle┼čtirin . Sayfa bir click olay─▒na veya onun gibi bir ┼čeye y├╝klendikten sonra bunu kullanmay─▒ test etmedim, ancak ba┼čar─▒s─▒z olaca─č─▒ndan eminim.

JQuery'i geni┼čletme fikrini sevdim, ama belli ki gerek yok.

Aramadan ├Ânce document.writeln , t├╝m komut dosyas─▒ ├Â─čelerini de─čerlendirerek komut dosyas─▒n─▒n zaten y├╝klenmedi─činden emin olmak i├žin denetler.

Bir beti─čin document.ready olay─▒ ger├žekle┼čene kadar tam olarak y├╝r├╝t├╝lmedi─čini varsay─▒yorum . (Kullanman─▒n document.ready gerekli olmad─▒─č─▒n─▒ biliyorum , ancak bir├žok ki┼či kullan─▒yor ve bununla ba┼č etmenin bir g├╝vencesi var.)

Ek dosyalar y├╝klendi─činde document.ready geri aramalar yanl─▒┼č s─▒rada ger├žekle┼čtirilir. Bir komut dosyas─▒ ger├žekten y├╝klendi─činde bunu ele almak i├žin, i├že aktar─▒lan komut dosyas─▒ yeniden i├že aktar─▒l─▒r ve y├╝r├╝tme durdurulur. Bu, kaynak dosyan─▒n ┼čimdi document.ready i├že aktar─▒lan herhangi bir komut dosyas─▒ndan sonra geri ├ža─čr─▒lmas─▒n─▒ sa─člamas─▒na neden olur .

Bu yakla┼č─▒m─▒n yerine jQuery'yi de─či┼čtirmeye ├žal─▒┼čabilirsiniz readyList , ancak bu daha k├Ât├╝ bir ├ž├Âz├╝m gibi g├Âr├╝n├╝yordu.

├ç├Âz├╝m:

 $.extend(true,
{
    import_js : function(scriptpath, reAddLast)
    {
        if (typeof reAddLast === "undefined" || reAddLast === null)
        {
            reAddLast = true; // Default this value to true. It is not used by the end user, only to facilitate recursion correctly.
        }

        var found = false;
        if (reAddLast == true) // If we are re-adding the originating script we do not care if it has already been added.
        {
            found = $('script').filter(function () {
                return ($(this).attr('src') == scriptpath);
            }).length != 0; // jQuery to check if the script already exists. (replace it with straight JavaScript if you don't like jQuery.
        }

        if (found == false) {

            var callingScriptPath = $('script').last().attr("src"); // Get the script that is currently loading. Again this creates a limitation where this should not be used in a button, and only before document.ready.

            document.writeln("<script type='text/javascript' src='" + scriptpath + "'></script>"); // Add the script to the document using writeln

            if (reAddLast)
            {
                $.import_js(callingScriptPath, false); // Call itself with the originating script to fix the order.
                throw 'Readding script to correct order: ' + scriptpath + ' < ' + callingScriptPath; // This halts execution of the originating script since it is getting reloaded. If you put a try / catch around the call to $.import_js you results will vary.
            }
            return true;
        }
        return false;
    }
});
 

Kullan─▒m─▒:

dosya3:

 var f3obj = "file3";

// Define other stuff
$(function(){
    f3obj = "file3docready";
});
 

file2:

 $.import_js('js/file3.js');
var f2obj = "file2";
$(function(){
    f2obj = "file2docready";
});
 

file1:

 $.import_js('js/file2.js');

// Use objects from file2 or file3
alert(f3obj); // "file3"
alert(f2obj); // "file2"

$(function(){
    // Use objects from file2 or file3 some more.
    alert(f3obj); //"file3docready"
    alert(f2obj); //"file2docready"
});
 

9







Her ne kadar bu cevaplar harika olsa da, komut dosyas─▒ y├╝klendi─činden beri var olan basit bir "├ž├Âz├╝m" var ve ├žo─ču insan─▒n kullan─▒m davalar─▒n─▒n% 99,999'unu kapsayacak. Sadece ihtiya├ž duydu─čunuz beti─čin ├Ân├╝ne ihtiyac─▒n─▒z olan beti─či dahil edin. ├ço─ču projede, hangi komut dosyalar─▒na ihtiya├ž duyuldu─čunun ve hangi s─▒rayla gerekti─činin belirlenmesi uzun zaman almaz.

 <!DOCTYPE HTML>
<html>
    <head>
        <script src="script1.js"></script>
        <script src="script2.js"></script>
    </head>
    <body></body>
</html>
 

E─čer script2 script1 gerektiriyorsa, bu ger├žekten b├Âyle bir ┼čeyi yapman─▒n en kolay yoludur. Neredeyse her durumda ge├žerli olacak en a├ž─▒k ve en basit cevap oldu─ču i├žin kimsenin bu sorunu ├ž├Âzmedi─čine ├žok ┼ča┼č─▒rd─▒m.


9







Bir JavaScript dosyas─▒ eklemek i├žin C # / Java'ya benzer bir s├Âzl├╝k kullanman─▒za izin verecek bir i┼člev yaratt─▒m. Biraz daha ba┼čka bir JavaScript dosyas─▒n─▒n i├žinden bile test ettim ve ├žal─▒┼č─▒yor gibi g├Âr├╝n├╝yor. Sonunda biraz "sihir" i├žin olsa da jQuery gerektiriyor.

Bu kodu, komut dizininin k├Âk dizinindeki bir dosyaya koydum (adland─▒rd─▒m global.js , ancak ne istersen onu kullanabilirsin. Bu yanl─▒┼č olmad─▒k├ža ve jQuery, belirli bir sayfada gerekli olan tek komut dosyalar─▒ olmal─▒. baz─▒ temel kullan─▒mlar─▒n ├Âtesinde b├╝y├╝k ├Âl├ž├╝de denenmemi┼č, bu y├╝zden yapt─▒─č─▒m gibi herhangi bir sorun olabilir veya olmayabilir, kendi sorumlulu─čunuzdad─▒r yadda yadda kullan─▒n Herhangi bir ┼čeyi mahvetti─činizden sorumlu de─čilim:

 /**
* @fileoverview This file stores global functions that are required by other libraries.
*/

if (typeof(jQuery) === 'undefined') {
    throw 'jQuery is required.';
}

/** Defines the base script directory that all .js files are assumed to be organized under. */
var BASE_DIR = 'js/';

/**
* Loads the specified file, outputting it to the <head> HTMLElement.
*
* This method mimics the use of using in C# or import in Java, allowing
* JavaScript files to "load" other JavaScript files that they depend on
* using a familiar syntax.
*
* This method assumes all scripts are under a directory at the root and will
* append the .js file extension automatically.
*
* @param {string} file A file path to load using C#/Java "dot" syntax.
*
* Example Usage:
* imports('core.utils.extensions');
* This will output: <script type="text/javascript" src="/js/core/utils/extensions.js"></script>
*/
function imports(file) {
    var fileName = file.substr(file.lastIndexOf('.') + 1, file.length);

    // Convert PascalCase name to underscore_separated_name
    var regex = new RegExp(/([A-Z])/g);
    if (regex.test(fileName)) {
        var separated = fileName.replace(regex, ",$1").replace(',', '');
        fileName = separated.replace(/[,]/g, '_');
    }

    // Remove the original JavaScript file name to replace with underscore version
    file = file.substr(0, file.lastIndexOf('.'));

    // Convert the dot syntax to directory syntax to actually load the file
    if (file.indexOf('.') > 0) {
        file = file.replace(/[.]/g, '/');
    }

    var src = BASE_DIR + file + '/' + fileName.toLowerCase() + '.js';
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = src;

    $('head').find('script:last').append(script);
}
 

7



─░lgili yay─▒nlar


Subversion'da dosyalar─▒ nas─▒l g├Ârmezden gelirim?

Git'teki bir dizindeki dosyalar─▒ nas─▒l yok sayabilirim?

Js dosyas─▒ ba┼čka bir js dosyas─▒na nas─▒l dahil edilir? [├žift]

ASP.NET MVC 3 Razor: Ba┼čl─▒k etiketinde JavaScript dosyas─▒n─▒ dahil edin

JavaScript dosyas─▒n─▒ Chrome konsoluna dahil et

Dosyalar─▒ node.js dosyas─▒nda nas─▒l ta┼č─▒r─▒m?

Bir javascript fonksiyonunu ba┼čka bir js dosyas─▒nda ├ža─č─▒rmak

.Vimrc dosyamdaki bir ┼čeyi nas─▒l ÔÇťkaynakÔÇŁ yapar─▒m?

JavaScript dosyas─▒n─▒ k─▒smi g├Âr├╝n├╝mlere dahil et

Git'teki dosyalar─▒ eski bir alt mod├╝l├╝n yoluna nas─▒l eklerim?

Etiketle ilgili di─čer sorular [javascript]


Bir dosyay─▒ belirli bir revizyona nas─▒l s─▒f─▒rlayabilir veya geri alabilirim?

JQuery'de birden fazla s─▒n─▒f─▒ olan bir ├Â─čeyi nas─▒l se├žebilirim?

Ondal─▒k JavaScript onalt─▒l─▒k nas─▒l d├Ân├╝┼čt├╝r├╝l├╝r

Scala'da nesne ve s─▒n─▒f aras─▒ndaki fark

Android'de ba┼čka bir uygulamadan uygulama ba┼člatma

@Mock ve @InjectMocks aras─▒ndaki fark

Linux'ta cURL kullanarak HTTP POST ve GET [kopya]

Ruby'de Enums nas─▒l uygulan─▒r?

clang hatas─▒: bilinmiyor arg├╝man─▒: '-mno-fused-madd' (python paketi kurulum hatas─▒)

Bir nesneyi iletirken neden 'ref' anahtar s├Âzc├╝─č├╝n├╝ kullan─▒n?