JavaScript中如何使用模块开发

全篇共 570 字。按500字/分钟阅读,预计用时 1.1 分钟。总访问 229 次,日访问 3 次。

将不同功用的代码封装到不同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'