es6 import {} 和 import * 有什么区别

Question

看见google 地图的 API 有这样的写法
import {} from "googlemaps";
但是我看了es6的文档没有说明这个这个是什么意思?

Answer 1

你说的是import * as xxx from xxx这样的嘛？这表示给导入对象取一个别名。当用export导出对象，变量，函数时，需要指定变量名或者函数名，然后import {} 解构一一对应，另外一种办法就是上面说的给导入对象取一个别名。比如说你在一个文件test.js中export const test = { a: 111 },那么在另外一个文件中import { test } from './test.js',这个test就是{
a: 111 }其实就是变量解构;然后你还可以import * as test1 from './test.js',这个test1就是 { test: { a: 111 } },如果想取到a的值，你调用的时候应该test1.test.a

Answer 2

import * as a from 'xxx'

import { b, c } from 'xxx'

这两种方式前者引入模块所有导出内容，并打包为a.
后者只导入模块导出的b和c这个内容。
使用的时候，第一种方式a.b, a.c, 和第二种方式b,c是一样的。
当前页面要引入模块xxx的多个导出时，可以用第一种方式，代码可以写的简洁一些，并且不会污染当前命名空间。
使用了就知道二者区别了。

Answer 3

export default用import *
export const * 用 import {}