ES6："import * as alias" 对比 "import alias"

Question

有什么区别吗:

import utils from 'utils'

和

import * as utils from 'utils'?

案例A：

//utils.js
export function doSomething()
{
//...
}

案例B：

//utils.js
export function doSomething()
{
//...
}
export default function doSomethingDefault()
{
//...
}

更新:

我被 vscode 的 intellisense 功能误导了，但正如推荐的那样，在 node+babel 上进行的小测试显示了差异：

//index.js
import utilsCaseA from './utils1'
import * as utilsCaseAWildcard from './utils1'
var utilsCaseARequire = require('./utils1')

import utilsCaseB from './utils2'
import * as utilsCaseBWildcard from './utils2'
var utilsCaseBRequire = require('./utils2')

var compareObjects = 
{
    utilsCaseA, utilsCaseAWildcard, utilsCaseARequire,utilsCaseB,utilsCaseBWildcard,utilsCaseBRequire
};
console.log(compareObjects);

Answer 1

import utils from 'utils' 从 'utils' 包中导入默认值。 undefined 在提供的情况下。

import * as utils from 'utils' 导入整个模块 exports 对象以及所有可用的命名导出，包括默认值。

Answer 2

根据你的例子：

案例A：

//utils.js
export function doSomething()
{
//...
}

案例 B：

//utils.js
export function doSomething()
{
//...
}
export default function doSomethingDefault()
{
//...
}

结果：

import utils from 'utils'
utils() // (Case A: undefined, Case B: doSomethingDefault)

import * as utils from 'utils'
utils // (Case A: utils = { doSomething: function }, Case B: utils = { doSomething: function, default: function })

import { doSomething } from 'utils'
doSomething() // (both Case A and Case B: doSomething = doSomething)

Case A 和 Case B 的区别在于，在 Case A import utils from 'utils' 中，utils 将是 undefined，因为没有默认导出。在情况 B 中，utils 将引用 doSomethingDefault。

使用import * as utils from 'utils'，在案例A中utils将有一种方法（doSomething），而在案例B中utils将有两种方法（doSomething 和 default).

ES6："import * as alias" 对比 "import alias"

ES6: "import * as alias" vs "import alias"

javascript

ecmascript-6

es6-modules