Jon*_*llo 6 javascript typescript ecmascript-6
我正在尝试使用es6模块语法重新导出变量,然后更改它并查看最终导入中反映的更改.但它没有按预期工作.请参阅以下示例:
a.ts
export var a = 1;
export function changeA() { a = 2; }
Run Code Online (Sandbox Code Playgroud)
b.ts
export * from './a';
Run Code Online (Sandbox Code Playgroud)
c.ts
import { a, changeA } from './b';
console.log(a); // 1
changeA();
console.log(a); // Expected 2 but get 1
Run Code Online (Sandbox Code Playgroud)
tsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"outDir": "out"
}
}
Run Code Online (Sandbox Code Playgroud)
运行结果:
$ node out/c.js
1
1
Run Code Online (Sandbox Code Playgroud)
我希望最终的console.log打印2以反映更新,但事实并非如此.但是,如果我用babel编译相同的例子,它就可以了.是否重新导出可变变量绑定根本不适用于打字稿,或者我只是做错了什么?
这是因为b.ts:
export * from './a';
Run Code Online (Sandbox Code Playgroud)
转译为
function __export(m) {
for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
}
__export(require('./a'));
Run Code Online (Sandbox Code Playgroud)
并且变量的值a被复制而不是被引用。
您可以通过以下方式解决此问题:
a.ts :
export var a = 1;
export var deeper = {
a: 1
};
export function changeA() {
a = 2;
deeper.a = 2;
}
Run Code Online (Sandbox Code Playgroud)
b.ts:
export * from './a';
Run Code Online (Sandbox Code Playgroud)
c.ts :
import { a, deeper, changeA } from './b';
console.log(a); // 1
changeA();
console.log(a); // Expected 2 but get 1
console.log(deeper.a); // prints 2 as expected
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1096 次 |
| 最近记录: |