zoukankan      html  css  js  c++  java
  • require.js

    requirejs的作用:

    1.实现js文件的异步加载,防止页面失去响应;
    2.管理模块与模块之间的依赖性,以便于开发人员的编写与维护

     如何引用

    方式一,放在网页底部进行加载

    方式二,

    <script src="js/require.js" defer async="true"></script>

    如何加载自己的文件

    如果我们的文件为main.js

    <script src="js/require.js" data-main="js/main"></script>

     如何编写主模块

    1.不依赖其他模块
    直接写js代码
    2.依赖其他模块
    require(['A','B', 'C'], function(A, B, C)){ //类似于angularjs中的DI依赖注入
        //
    });    

    require()函数有两个参数,第一个参数是数组,为所依赖的模块;第二个参数为回调函数,当前面指定的模块都加载成功后,它将会被调用,加载的模块会以参数形式传入该函数,从而在回调函数内部就可以使用这些模块。

    加载模块

    require.config({
       paths: {
          "jquery": "jquery.min",
        "underscore": "underscore.min",
        "backbone": "backbone.min"    
       } 
    });
    路径可以直接改变基目录baseUrl,也可直接指定网址。
    这个配置写在main.js头部

    如何编写AMD模块

    1.如果不依赖其他模块,那么可直接定义在define()函数中
     // math.js
      define(function (){
        var add = function (x,y){
          return x+y;
        };
        return {
          add: add
        };
      });
       加载方式
          // main.js
      require(['math'], function (math){
        alert(math.add(1,1));
      });
    2.如果这个模块还依赖其他模块,那么define()函数的第一个参数须是一个数组,致命该模块的依赖性
      define(['myLib'], function(myLib){
        function foo(){
          myLib.doSomething();
        }
        return {
          foo : foo
        };
      });

    加载非规范的模块

      require.config({
        shim: {
    
          'underscore':{
            exports: '_'
          },
          'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
          }
        }
      });

    require.config()接受一个配置对象,这个对象除了有前面说过的paths属性之外,还有一个shim属性,专门用来配置不兼容的模块,具体来说,每个模块要定义,exports值输出的变量名,表明这个模块外部调用时的名称,deps数组,表明该模块的依赖性。

  • 相关阅读:
    关于技术的学习及批判 人工智能
    爱迪生如何看待手机程序员怎么用移动互联网 人工智能
    量子学习及思考4群体意识 人工智能
    程序员的出路 人工智能
    函数式编程学习之路(14) 人工智能
    量子学习及思考1开篇 人工智能
    函数式编程学习之路(16)图灵完备 人工智能
    开机启动
    动态连接库
    静态常量的问题
  • 原文地址:https://www.cnblogs.com/fire-passiontao/p/5969609.html
Copyright © 2011-2022 走看看