require｜undefined

commonJs适用于服务器端
AMD适用于浏览器端

requireJS采用AMD规范
requireJS的使用

一个网页需要加载很多js，加载js的时候页面停止渲染影响用户体验降低使用性能

　　<script src="1.js"></script>
　　<script src="2.js"></script>
　　<script src="3.js"></script>
　　<script src="4.js"></script>
　　<script src="5.js"></script>
　　<script src="6.js"></script>

require的出现解决得问题
1.实现js文件得异步加载，避免网页失去响应
2.管理模块之间的依赖，便于代码的维护和编写

使用

1.下载requireJS 将其放置到页面中

1	<script src="js/require.js"></script>

2.requireJS 也可能造成网页失去响应解决办法
(1) 放在网页底部加载
(2)

3.加载require.js以后，下一步就要加载我们自己的代码了。假定我们自己的代码文件是main.js，也放在js目录下面。那么，只需要写成下面这样就行了：

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

data-main属性的作用是，指定网页程序的主模块。在上例中，就是js目录下面的main.js，这个文件会第一个被require.js加载。
由于require.js默认的文件后缀名是js，所以可以把main.js简写成main。

4.mainJS如何写
如果mainJS没有任何依赖那么直接编写页面所需代码

1
2
3

　　require(['jquery', 'underscore', 'backbone'], function ($, _, Backbone){
　　　　// some code here
　　});

require函数有两个函数第一个参数表示需要加载的模块第二个参数是回调函数
只有当前面的模块加载成功之后，才会去执行回调函数

5.A.js 依赖B.js 如何编写不符合AMD模块的js如何引用

加载非规范的模块

require.config({    //配置require  JS路径
     // baseUrl: '',
    shim: {
        'jquery': {
            exports: '$'
        },
        'bootstrap': {
            deps: ['jquery'],       //bootstrap得依赖
            exports: 'bootstrap',
        }
    }
});
require(['jquery','bootstrap'], function ($){
    let a = $('#box').html()
    console.log(a)
    console.log()
});

6.模块的写法

require模块的写法

// math.js
　　define(['myLib'], function (){        math依赖myLib这个模块
　　　　var add = function (x,y){
　　　　　　return x+y;
　　　　};
　　　　return {
　　　　　　add: add
　　　　};
　　});
      加载方法如下：
// main.js
　　require(['math'], function (math){
　　　　alert(math.add(1,1));
　　});

小结
html页面引用js次数大量减少 require异步加载js执行不需要在渲染页面的时候等待js加载完成。