Javascript ES6 导出 const 与导出 let

Posted

技术标签:

【中文标题】Javascript ES6 导出 const 与导出 let【英文标题】:Javascript ES6 export const vs export let 【发布时间】:2015-12-10 02:00:29 【问题描述】:

假设我有一个要导出的变量。有什么区别

export const a = 1;

export let a = 1;

我了解constlet之间的区别,但是当你导出它们时,它们有什么区别?

【问题讨论】:

export 关键字详细信息here。目前,任何网络浏览器都不支持它。 【参考方案1】:

我认为一旦你导入它,行为是相同的(在你的变量将在源文件之外使用的地方)。

唯一的区别是如果您尝试在此文件结束之前重新分配它。

【讨论】:

【参考方案2】:

在 ES6 中,imports 是导出值的实时只读视图。结果,当你做import a from "somemodule";时,无论你在模块中如何声明a,你都无法赋值给a

但是,由于导入的变量是实时视图,它们确实会根据导出中的“原始”导出变量而改变。考虑以下代码(借自下面的参考文章):

//------ lib.js ------
export let counter = 3;
export function incCounter() 
    counter++;


//------ main1.js ------
import  counter, incCounter  from './lib';

// The imported value `counter` is live
console.log(counter); // 3
incCounter();
console.log(counter); // 4

// The imported value can’t be changed
counter++; // TypeError

如您所见,区别真正在于lib.js,而不是main1.js


总结一下:

无论你如何在模块中声明相应的变量,你都不能给import-ed变量赋值。 传统的let-vs-const 语义适用于模块中声明的变量。 如果变量声明为const,则不能在任何地方重新分配或重新分配。 如果变量声明为let,则只能在模块中重新赋值(而不是用户)。如果发生变化,import-ed 变量也会相应变化。

参考: http://exploringjs.com/es6/ch_modules.html#leanpub-auto-in-es6-imports-are-live-read-only-views-on-exported-values

【讨论】:

以上是关于Javascript ES6 导出 const 与导出 let的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript ES6 - let 与 const 使用方及与var对比

JavaScript ES6 - let 与 const 使用方及与var对比

JS ES6:声明const并将其导出为默认值与将其直接声明为默认导出之间的区别

ES6 JavaScript 实用开发技巧

重温JavaScript(lesson2):关于ES6中的const

JavaScript之ES6常用新特性