ES5 和ES6的模块化写法

天问运

已于 2022-04-08 14:44:49 修改

阅读量986

点赞数

分类专栏： Java攻城狮摇篮文章标签： es6 es

于 2022-04-08 14:14:10 首次发布

本文链接：https://blog.csdn.net/lilong329329/article/details/124037924

版权

Java攻城狮摇篮专栏收录该内容

3 篇文章

订阅专栏

本文详细介绍了ES5和ES6两种不同语法下的模块化操作。在ES5中，通过`module.exports`导出模块方法，而ES6则提供了`export`和`import`关键字进行模块导入和导出。示例展示了如何在不同场景下使用这些语法进行函数或对象的导入和调用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ES5模块化语法

被调用模块js：001.js

/*模块化操作*/
const sum =function (a,b) {
    return parseInt(a)+parseInt(b);
}
const subTract =function (a,b){
    return parseInt(a)-parseInt(b)
}
/*设置被其他js调用的js方法*/
module.exports ={
    sum,
    subTract
}

调用模块js，ES5语法 002.js

//引入需要被引入的模块
const m =require('./001')
console.log(m.sum(8,9))
console.log(m.subTract(9,3))

ES6模块化语法

被调用模块js

/*es6的模块化选择*/
export function getList() {
    console.log("获取数据列表")
}

export function save() {
    console.log("保存数据")
}

调用模块js

import {getList,save} from './001'  //001.js  此处可以省略
getList();
save();

es6语法的第二种写法

被调用方js
export default {
    getList(){
        console.log("getList.........")
    },
    save(){
        console.log("save 测试保存es6语法。。。。。。")
    }
}

调用方js

import m from './001'   //m抽象为了一个对象，001 表示被调用方js的名称

//调用js
m.getList();
m.save();