commonJS规范

CommonJS 规范是为了解决 JavaScript 的作用域问题而定义的模块形式，可以使每个模块它自身的命名空间中执行。该规范的主要内容是，模块必须通过 module.exports 导出对外的变量或接口，通过require() 来导入其他模块的输出到当前模块作用域中。

a.js

module.exports=function(val){
   return val*2;
}

b.js

var res = require('./a');
var result = res(4);

http://wiki.commonjs.org/wiki/CommonJS。

CommonJS 是同步加载模块

 

AMD（异步模块定义）是为浏览器环境设计的，因为 CommonJS 模块系统是同步加载的，当前浏览器环境还没有准备好同步加载模块的条件。

 

AMD 定义了一套 JavaScript 模块依赖异步加载标准，来解决同步加载的问题。

  http://webpackdoc.com/amd.html

imort require

 

ES6  import 引入  export 导出   所有的引擎都还没有实现import 
nodejs  采用 commonJS require引入  module.exports 导出
在node中使用babel支持ES6，仅仅是将ES6转为ES5，import语法会被转码为require 

 ES6 import export 

借助 vue-cli ,某个 vue文件

<template>
  <button @click="test">btn</button>
</template>

<script>
  import {num, b, d, f1, g} from '../test/0'
//  import * as test from '../test/0'  // 引进全部    0.js
  export default{
    methods: {
      test () {
        console.log('num: ' + num)
        console.log(b)
        console.log(d(3))  // 函数
        console.log(f1(10))
        console.log(g)
//        console.log(test.b)   // 输出某个
      }
    }
  }
</script>

0.js

let a = 1
let b = 'name'
let c = true
let d = (a) => a + 5
function f1 (val) {
  return val - 3
}
// export let g = 'ggg'  // 导出一个
export {a as num, b, c, d, f1}  // 导出一堆

 export default 

0.js

export default function () {  // default 函数只有一个
  console.log(111)
}
let c = 'ccc'
let d = 'dd'
export {c, d}

xx.vue

<template>
  <button @click="test">btn</button>
</template>

<script>
  import a, {c, d} from '../test/0'  //  引入default函数可以 自定义名字，并且不加{}
  export default{
    methods: {
      test () {
        a()
        console.log('c: ' + c + 'd: ' + d)
      }
    }
  }
</script>

 

两种写法

const url = {
  'a': 'http://www.baidu.com',
  'b': 'http://www.126.com'
}
// const URL = url['a']  // ES6 对象的扩展 属性名表达式　
const URL = url.a      // 常规
export {API_ROOT, URL}

 

转载于:https://www.cnblogs.com/gyz418/p/6629183.html