美文网首页
ES6中模块export与import总结

ES6中模块export与import总结

作者: 周星星的学习笔记 | 来源:发表于2021-03-28 14:42 被阅读0次

    一、模块导出(export)

    1.分别暴露

    //分别暴露
    export let name = '周星星';
    
    export function say() {
        console.log('哈罗你好,周星星');
    }
    

    2.统一暴露

    //统一暴露
    let name = '周星星';
    
    function say() {
        console.log('哈罗你好,周星星');
    }
    
    export { name, say }
    

    3.默认暴露

    //默认暴露
    export default {
        name: '周星星',
        say() {
            console.log('哈罗你好,周星星');
        }
    }
    

    二、模块导入(import)

    1.通用的导入方式

    import * as m1 from "./src/m1.js"
    console.log(m1);
    

    2.解构赋值形式

    //导入「分别暴露」或者「统一暴露」的模块
    import { name, say } from "./src/m1.js"
    console.log(name);
    say();
    
    //导入的同时重命名
    import { name, say as hello } from "./src/m2.js"
    console.log(name);
    hello();
    
    //导入默认暴露的模块
    import { default as m3 } from "./src/m3.js"
    console.log(m3);
    

    3.简便形式,针对默认暴露

    //不需要使用{}
    import m3 from "./src/m3.js"
    console.log(m3);
    

    三、备注

    1.本文参照:https://www.bilibili.com/video/BV1uK411H7on?p=43

    相关文章

      网友评论

          本文标题:ES6中模块export与import总结

          本文链接:https://www.haomeiwen.com/subject/nvuphltx.html