export 和 export default 的相同点以及区别

export 和 export default 的相同点以及区别（不同点）

export 和 export default 的相同点

1. 都是ES6语法，都可以输出变量、函数；
2. import引入的文件模块中，“必须”是用export或者export default定义的；

export 和 export default 的用法区别

1. 两者输出模块的语法不同

• export 输出的变量以及函数必须是声明式的(即：要定义出变量以及函数的名称)

• export default输出的变量以及函数不需要声明式的

  举例说明：
      （a）: export以及export default输出变量-字符串a 
      
			export var str = "a";   // export 输出的“a”要声明定义var str
         	export default "a"     // export default输出的“a”不需要定义

      （b）:  export以及export default输出变量 - json格式的对象（可以看作是一个类）
      
      		  export var json = { // export 输出的json对象要声明定义var json
   	            name: 'aa',
   	            age: 18,
   	            sex: '女'
   	          }
   	          export default {
   	            name: 'aa',
   	            age: 18,
   	            sex: '女'
   	          }

      （c）: export以及export default输出方法func方法
      
   	 		export function func() { // export 输出的方法名要进行定义 function func()
   	          		console.log('aa');
   	        }
   	        export default function(){ // export default 定义的函数为匿名函数
   	          		console.log('bb');
   	        }

2. 在一个js文件中，export和 export default出现的次数限制不同

• export 在一个文件中可以出现“多次”

• export default 在文件中只能出现“一次”

    比如现在创建一个test.js, 在test.js中写入如下代码，不会报错：
      （因为export default只出现了一次,  export 可以出现多次）
      
        export var a = 1;
        export function b() {
          console.log('b')
        }
        export var af = {
          col: 'aa'
        }
        export var e = {
          col: 'ecd'
        }
        export default ['aa', 'aa']；

3. import引入export和export default定义的模块的方式不同

• 其他js文件，要引入test.js文件中export定义的模块（test.js内容为上述第2点创建的）；
  （下边示例可看到，import 后边加了 {}，且{}里边的名称要和export输出模块定义的名称保持一致）

import {a,b,af} from ‘test.js’;   
// 在第2点的test.js文件中，export声明了a，b,af,e,看自己需要什么功能，按需加载。注：{}里边的名称要与export定义的名称要一致

• 其他js文件, 要引入test.js文件中export default定义的模块
  （不需要{}，且test名称可以随意取）

import test from ‘test.js’; // import 后边不加{}，会默认加载test.js文件中export defalut定义的模块,test名可以随意取

---

---

这边顺便提下
export的语法可以如下写：

var firstName = 'Michael';
var lastName = 'Jackson';
function v1() { console.log('v1') }
function v2() { console.log('v2') }

export {
  v1 as streamV1,   // as语法改变了对外输出的名称
  v2 as streamV2,   // as语法改变了对外输出的名称
  firstName,
  lastName
};

在其他文件引用相应的模块：
import { streamV2, firstName} from '../../js/test.js'

import和require的区别

1. import是ES6的语法，import的模块是编译时调用
2. require是AMD规范引入方式，require的模块是运行时调用，所以性能比import低