javascript中的import*代表什么？

Question

我正在研究使用React Redux构建的应用程序.在代码中,有一个这样的语句:

import * as test from 'util/test'

我知道这样的陈述:

 import test from 'util/test' 

这样的陈述:

 import {test} from 'util/test' 

但*对我来说是新的.

任何人都可以向我解释这种语法的含义及其工作原理吗？

Answer 1

as test正如您在ES2015规范中所看到的那样,没有该部分的原始问题不是有效的语法.您更新的示例有效,但由于原因不明确,因此未被广泛使用.

在编写时import * as test from 'util/test',您可以访问具有名称的对象上"util/test.js"的所有导出test.例如,假设"util/test.js"导出一个值为的单个常量42,如下所示:

// util/test.js
export const myNumber = 42;

现在,假设您想要在其他模块中访问上面的常量(让我们称之为"index.js").当然,您可以使用更典型的语法访问它,如下所示:

// index.js
import {myNumber} from 'util/test';

console.log(myNumber); // => 42

或者,使用import * as ...语法,您可以执行以下操作:

// index.js
import * as test from 'util/test';

console.log(test.myNumber); // => 42

在第一个例子中,我们myNumber直接导入模块范围; 在第二个例子中,myNumber是属性test.

有关的好处{...}语法是,它使我们的进口的名字在文件的顶部明确.此外,我们可以直接访问模块级别的导入; 我们不必通过其他对象继续访问它.这可能是*语法相对罕见的原因.但它有它的用途,你有时会看到它,所以尽管如此熟悉它也是好的.