javascript规范（js）

EMCAScript规范

javascript语言实现,ES6规范（使用babel编译器将es6转换为es5，webpack只支持部分es6）：

import "jquery";           //返回function
export function doStuff() {}
module "localModule" {}

es5:

var o = require('s.js');

export default只有一个，export可以有多个

commonjs规范

nodejs语言实现

require("module");
require("../file.js");     //require返回对象 object
exports.doStuff = function() {};
module.exports = someValue;

浏览器不兼容nodejs，需要通过browserify工具转换为浏览器支持js
（例如：browserify main.js > compiled.js）：
浏览器不兼容nodejs的几个模块

• module
• exports(ES6中export)
• require
• global

AMD（异步加载模块，npm中requirejs模块，依赖前置，提前加载所有）

require同步==》异步require([module], callback); //由require.js和curl.js实现

网页js的异步加载
<script src=“js/require.js” defer async=“true” >

内部函数

• require.config({参数}) //自动加载模块

require.config({
　　　　baseUrl: "js/lib",
　　　　paths: {
　　　　　　"jquery": "jquery.min",
　　　　　　"underscore": "underscore.min",
　　　　　　"backbone": "backbone.min"
　　　　}
　　});

• define([‘’],function(){}) //指明依赖模块和定义模块
• 加载非amd规范的模块，shim

require.config({
　　　　shim: {             //shim配置不兼容模块
　　　　　　'underscore':{           //不兼容的库名称
　　　　　　　　exports: '_'
　　　　　　},
　　　　　　'backbone': {                  //不兼容的库名称
　　　　　　　　deps: ['underscore', 'jquery'],
　　　　　　　　exports: 'Backbone'
　　　　　　}
　　　　}
　　});

CMD（就近依赖），需要时加载

淘宝工程师编写seajs，提出cmd规范

• define(function(require, exports, module){}）
• seajs.use()

cmd和amd区别

define(function(require, exports, module){              //CMD
    var a = require(moduleA);
    a.dosomething();
    var b = require(moduelB);
    b.dosomething();
});

define([moduleA, moduleB],function(a, b, require, exports, module){                //AMD
    a.dosomething();
    b.dosomething();
});

js模块化方案

seajs、requirejs（在线编译，amd和cmd编译器在浏览器中） webpack、browserify（预编译）

javascript

document.createElement 写文件
new HtmlElement写内存

export、export default、module.export

---

export 多个{a,b}
或者
export a
export b
import带{}

---

export default 只能有一个，import不用{}

---

module.export 默认到处{}对象，module.export = 重新赋值

---

类型判断

js判断对象、函数、和全局变量

• commonjs

typeof module === “object” && module && typeof module.exports === “object”

• amd

typeof define === “function” && define.amd

• es5、es6

typeof window === “object” && typeof window.document === “object”

js import

import $ from 'jquery/dist/jquery.min';         //jquery文件return对象，$可以直接用，绑定到window上全局变量（或者html中script引用jquery文件）
window.$ = $      //js支持类的扩展，所以很多函数找不到定义的，全局变量扩展得到
window.jQuery = $

import editormd from 'editor.md/editormd';          //editormd文件没有返回值，需要先构建对象editor()()，再调用

js …运算符

• 对象深拷贝

var obj;
var a = {...obj}    //深拷贝对象

• 参数展开（多参数）

var a = {"a":"a","b":"b"}
var b = {...a} //{"a":"a","b":"b"}
var c = {...a,"b":"b1"} //{"a":"a","b":"b1"}
var d = {...a,...{"a":"a1","b":"b1"}} //{"a":"a1","b":"b1"}

js对象成员扩展

js对象即json对象，使用obj[“a”]添加对象成员，使用obj.a访问

js重要模块

promise.js、asm.js、jquery.js、require.js