zoukankan      html  css  js  c++  java
  • ES6 import、export的写法

    大家都知道来到ES6版本,ES就原生支持JS Module的概念。

    import和export的写有哪些呢,我们看看

    import:

    import from 和 var 变量一样,也会存在提升,这意味着可以在 import 之前用 import 进来的东西

    import './xxx.js'; // 只会执行import的js文件,但是不会引入任何值
    
    import a, {b, c} from './xxx.js'; // 等价于 import {default as a, b, c} from './xxx.js';
    
    import * as xxx from './xxx.js'; // 作为一个整体加载,结果为{default: xxx, b: xxx, c: xxx}

    export:

    let a = 123;
    function addA() {
        a++;
    }
    
    export default a;  // 等价于 export default 123,执行addA不会影响default
    
    export {a as default}; // 想执行addA影响到default,只能用as把default作为a的别称
    
    export {a, addA}; // 等价于 export let a = 123; export functin addA(){...}

    复合写法:

    export {a ,b} from './xxx.js';
    
    // 等效于
    import {a, b} from './xxx.js';
    export {a, b};

    // 整体输出 值得注意的是 export *会把my_module的default给丢掉
    export * from 'my_module';

    import函数:

    因为import xxx from 'xxx'的写法是编译时的语法,没办法动态加载

    // 形如这样的写法是会报错的
    if (x === 2) {
      import MyModual from './myModual';
    }

    为了实现动态加载,我们又有了import函数,跟require相似,不过是异步的

    if (condition) {
      import('moduleA').then(...);
    } else {
      import('moduleB').then(...);
    }

    推荐阅读:Module的语法

  • 相关阅读:
    Ubuntu 上安装MySql
    Vue中组件的使用
    Swagger在 NETcore 中的使用
    awk 中 fieldwidths使用方法
    3.BIND从服务器及缓存服务器配置
    2.BIND服务基础及域主服务器配置
    1.DNS基础及域名系统架构
    Linux防火墙iptables的策略
    inode占用100%时硬盘无法写入文件故障处理
    特殊计算方式(数组)
  • 原文地址:https://www.cnblogs.com/amiezhang/p/11217354.html
Copyright © 2011-2022 走看看