Detailed DEFINE function in Require.js

Preface

The module is different from a conventional script file, which is well defined a scope to avoid global namespace pollution. It can explicitly list its dependencies and injects these dependencies in the form of a function (defined that function of this module) without reference to global variables. RequireJS modules are an extension of module mode, and the advantage is that there is no need to reference other modules in global. Requirejs’s module syntax allows it to load multiple modules as soon as possible, although the order of load is uncertain, but the order of dependencies is ultimately correct. At the same time, because there is no need to create global variables, you can even load different versions of the same module simultaneously on the same page.

When defining a module, the first line of the method writes a “use strict”; what is this?
Use strict – Strict mode, this mode allows JavaScript to run under stricter conditions.

    Some unreasonable, unscrupulous, reducing some weird behavior;
  • eliminates some unsafe of the code to ensure the security of the code operation;
  • Improve compiler efficiency and increase operational speed;
  • makes a good pave for future new version of JavaScript.
  • 1. Simple value to module

It is actually incorporated with the file name as the Name parameter. If it rely on the component, it is returned. An object!

Define ({Name: “HEHE”, AGE: “18”});

   2. Simple Function Module 
The same file name as the above is the default NAME, and the difference from the above is that the code outside the return value can be performed in advance

Define (Function () {Return {Name: “HEHE”, AGE: “18”};});

3. Dependent function module
   
Define ([Angular ‘,’ JSUTIL ‘,’ Modules / Meet / Modules ‘,’ Modules / meet / service / meet ‘,’ modules / meet / services / meetremoteService ‘], function (required) {‘ use strict ‘; var module = angular.module (‘ meet.services ‘); module.factory (‘ MeetService) , Function (Meet, MeetRemoteService) {var service = {name: ‘Hehe’, AGE: ’18’}; return service;});};

Like the same, the key is that the dependency module is incorporated in the form of a return value as an incoming parameters. If the load error or does not find the corresponding module, then the resulting income is undefiend, you need to pay attention!
4. Return Function Module

  Define ([Angular ',' JSUTIL ',' Modules / Meet / MODULES ',' MODULES / Meet / Services / Meet ',' Modules / Meet / Services / MeetRemoteService '], function (require) {' use strict '; var module = angular.module (' meet.services'); module.factory ( 'MeetService', function (Meet, MeetRemoteService) {var service = {}; service . Getweekofmeet = function (weekflag, date) {returnflag, date) .Then (function (data) {data.content = meet.Sortmet (data.content);} returnid; });});  
, the same, the function is returned here, which is called as a function object in the dependent module, in fact, this is a simple Closure!


Define (‘Sample3’, [‘Sample’, ‘Sample1’], Function (SAMPLE, SAMPLE1) {var Sample4 = Require (‘Sample4’); returnial () {Alert (Sample.Name + ‘:’ + sample.sayhell ());}});
   This is a complete definition, name, dependent, is called, and there is a dependent object in the form of Common! 
OffThe relationship between the dependent of the Name and Require functions of the define function

Define (name, [], callback); This name can be saved, the default is the file name Of course, it can also be customized. Once we define the Name, according to the source code we can find that the DEFINE function is actually putting this Name and dependent module, the callback function is stored in a global array, i.e., Defqueue. Push ([Name, DEPS, CALLBACK]);
So this Name is the ID registered with this component!

Require ([Name, Name2], Callback; The system will first retrieve whether the path in PATH in the full text, if not naturally put him as the path to Baseurl to be asynchronously loading this JS file, can be seen from the source code when loading,
 var data = getScriptdata (evt);  returned  data.id 
is actually name, then execute contex.completeload (Node.ID)
, it is clear inside, comparing the Name registered in Define and the Name here if it is equal.

So the truth is: Require and Define Name must be uniform!

Summary

The above is the full content of this article, I hope this paper will bring a certain amount of learning or work. Help, if you have any questions, you can leave a message, thank you for your support of Tumi Cloud.

© Copyright Notice
THE END
Just support it if you like
like0
share
comment Grab the couch

Please log in to comment