二、ES6 export和import

user.js

var info={
    username:'小明',
    age:12
}

var sex='女';

function changeName(newname){
    info.username=newname;
}

export {info , changeName } //通过export开放info和changeName

<script type="module">
    import {info , changeName }  from './user.js'
    console.log(info)
    changeName('asdf');
    console.log(info)
</script>

掌握export和import的更多写法

一个一个数据export

var sex='女';

export function changeName(newname){
    info.username=newname;
}

export var info={
    username:'小明',
    age:12
}

下面的代码是错误的：

var sex='女';
function changeName(newname){
    info.username=newname;
}
export changeName;
export var info={
    username:'小明',
    age:12
}
export info;

一次性接收所有export的数据

import * 表示接收所有，还要通过as取一个别名

import * as xxx  from './user.js'
console.log(xxx.info)
xxx.changeName('asdf')
console.log(xxx.info)

改名

export的时候，对名称不满意可以换

export {info as Info, changeName as ChangeName }

对应的，我们就可以使用新名字

import * as xxx  from './user.js'
console.log(xxx.Info)
xxx.ChangeName('asdf')
console.log(xxx.Info)

import的时候，也可以改名。

import {Info as user, ChangeName as changeName} from './user.js'
console.log(user)
changeName('asdf')
console.log(user)

export default 及其接收

export default在一个模块中最多只能用一次，可以返回任何数据。

var sex='女`
export default sex;

import s from './user.js'

export default和普通的export方式可以混用,接收的时候，export default开放的数据要在import语句中卸载前面。

import s,{Info as user, ChangeName as changeName} from './user.js'