1.es6 module导出来的数据是值的映射,而且是只读的,如果把导出去的变量更改会报错,模块里面的数据变化了 导出去的数据也会变化 a.js
let name= '我是a'
function changeName(){
name='a的name发生了变化了'
}
function getName(){
return name
}
export {name,changeName,getName}
b.js
import {name,changeName,getName} from 'a.js
console.log(name) //我是a
name='天线小宝宝' //会报错 VM4797 WAService.js:2 Error: "name" is read-only. 因为导出的数据是只读的
//更改a里面name的值
changeName()
console.log(name) // a的name发生了变化了
console.log(getName()) // a的name发生了变化了
2.commonjs导出的值是值的拷贝 可以更改,而且模块里面的值变化也并不会影响导出的值的变化 a.js
let name= '我是a'
function changeName(){
name='a的name发生了变化了'
}
function getName(){
return name
}
exports.name = name
exports.changeName = changeName
exports.getName = getName
b.js 模块内部的变化不会影响导出去的值的变化
let a = require('a')
console.log(name) //我是a
changeName()
console.log(name) //我是a
console.log(getName()) // a的name发生了变化了
3.以上都是理论值,实际上并没什么用 因为一般导出去的很可能是对象,如果是对象就不一样了 对象值的拷贝就是拷贝它在内存的地址 so 其实还是模块里面的那个对象
以下将举例说明一下
(1) es6 module的情况
a.js
let xiaoming= {name:'小明',age:'10岁'}
function changeName(){
xiaoming.name='大明'
}
function getName(){
return xiaoming
}
export {name,changeName,getName}
b.js
import {xiaoming,changeName,getName} from 'a.js
console.log(xiaoming.name) //小明
xiaoming='天线小宝宝' //会报错 VM4797 WAService.js:2 Error: "name" is read-only. 因为导出的数据是只读的
//但是 如果是改变xiaoming对象里面的值 就不会报错
xiaoming.name='我改名啦'
console.log(xiaoming.name) // 我改名啦
//更改模块里面的值
changeName()
console.log(xiaoming.name) // 大明
console.log(getName().name) // 大明
// 模块内的和导出来的 都是同一个对象
console.log(xiaoming===getName()) //true
// 同样 在外部更改 里面的值也会变化
xiaoming.name='我改名啦'
console.log(xiaoming.name) // 我改名啦
console.log(getName().name) // 我改名啦
(2) commonjs的情况
a.js
let xiaoming= {name:'小明',age:'10岁'}
function changeName(){
xiaoming.name='大明'
}
function getName(){
return xiaoming
}
exports.xiaoming = xiaoming
exports.changeName = changeName
exports.getName = getName
b.js
let a = require('a')
console.log(a.xiaoming.name) //小明
//更改模块里面的值
changeName()
console.log(a.xiaoming.name) // 大明
console.log(getName().name) // 大明
// 模块内的和导出来的 都是同一个对象
console.log(xiaoming===getName()) //true
// 同样 在外部更改 里面的值也会变化
a.xiaoming.name='我改名啦'
console.log(a.xiaoming.name) // 我改名啦
console.log(getName().name) // 我改名啦
结论 如上
