zoukankan      html  css  js  c++  java
  • 3分钟带你搞懂ES6 import 和 export

    如下语句是 default import:

    // B.js
    import A from './A'

    且只在A存在 default export 时生效:

    // A.js
    export default 42

    这种情况下你用import语句, 随便取什么名字都没关系:

    // B.js
    import A from './A'
    import MyA from './A'
    import Something from './A'

    因为他最终解析的是A.js 的 default export.


    如下是命名为A的 import :

    import { A } from './A'

    它只在A.js存在 具名export 时起作用, 像这样:

    // A.js
    export const A = 42

    这种情况下指定命名是有必要的, 因为你要从A.js的 export 里 import 即引入特定东西:

    // B.js
    import { A } from './A'
    import { myA } from './A' // 无效!
    import { Something } from './A' // 无效!

    要使引入生效, 你需要添加对应的 具名export :

    // A.js
    export const A = 42
    export const myA = 43
    export const Something = 44

    每个 module 只能有一个  default export, 但可以有任意多个 具名export, 也可以将它们放在一起引用:

    // B.js
    import A, { myA, Something } from './A'

    可以看到这里我们引入了 default export 并命名为A, 引入 A.js 的 myA 和 Something 这两个具名export

    // A.js
    export default 42
    export const myA = 43
    export const Something = 44

    import时我们还可以用 as 语句为他们起个别名:

    // B.js
    import X, { myA as myX, Something as XSomething } from './A'
  • 相关阅读:
    MySQL的删除语句
    机器学习-K-means聚类及算法实现(基于R语言)
    机器学习-线性回归补充-实践
    什么是JWT
    Java的NIO
    音乐播放器歌词同步显示
    Linux和Mac下安装RocketMQ过程
    支付宝沙箱应用
    HTML5 调用手机摄像头拍照
    JavaWeb图片上传的几种方式
  • 原文地址:https://www.cnblogs.com/skura23/p/7364642.html
Copyright © 2011-2022 走看看