JavaScript中如何使用模块开发

此篇想法总访问 11 次,今日访问 1 次。

将不同功用的代码封装到不同js文件中,每一个文件就是一个模块,这些文件之间通过导入导出语法联系。

CommonJS的模块导入导出规范,可以把require("...")理解成JavaScript中的值(原始值和引用值),既可以赋值给变量也可以导出。赋值的那个变量的名称随意,不一定要和文件名相同,我习惯和文件名相同。

// number.js
module.exports = 1234567

// main.js
const number = require('./number')

如果导出的是对象,在导入时解构赋值需要的对象属性,属性名称必须和导出的对象属性名称对应:

// light.js
module.exports = {
  open: () => {},
  close: () => {}
}

// home.js
var { open, close } = require('./light')

使用ES6+的模块导入导出语法,import用于导入,export用于导出。

// AppView.jsx
export default class AppView extends React.Component {
  render(){
    return (
     // ...
    )
  }
}

// main.js
import AppView from './AppView'
发布日期 » 2019年7月18日 周四
原创声明 » 请勿复制转载,谢谢配合。
Airglass.js核心库
JavaScript核心概念
硬件编程、Arduino
文档翻译计划
微信开发
前端脚手架
运维
可视化
生活自有“道”理
视觉设计、用户体验
陈帅华的微信二维码