模块化

作者: One_Hund | 来源:发表于2018-09-16 23:03 被阅读0次

模块化的优点

  • 解决命名冲突问题
  • 通过定义依赖可避免加载无用脚本
  • 减少代码耦合度
  • 方便多人分工合作
  • 模块复用,减少重复造轮子

commonjs 特点

1.通过require()方法,传入模块的标识,引入模块
2.模块标识可以是小驼峰命名的字符串或者的./../开头的相对路径或绝对路径
3.每个模块存在一个module对象,代表模块本身
4.每个模块都有独立的作用域(文件即模块)
5.通过上下文提供exports对象用于导出当前模块的方法和变量,同时exportsmodule的一个属性(可使用module.exports=..module.exports.a=..exports.a=..这3种写法,不能用exports=..这种写法)

如以下示例:

// 1.通过require来引入模块
// 2.模块标识符可以是小驼峰的字符串或者是相对或绝对路径
var http = require('http')
var moduleA = require('./moduleA')

// 3.每个模块存在一个module对象,代表模块本身
console.log(module)

// 4.每个模块都有独立的作用域(文件即模块)
console.log(a) // a is undefined

// 5.通过module.exports向外暴露对象或接口
module.exports.a = 1
module.exports.b = 2
// console.log(module.exports) => { a: 1, b: 2 }
module.exports={ a: 1, b: 2 }
// console.log(module.exports) => { a: 1, b: 2 }
module.exports=1
// console.log(module.exports) => 1
exports.a = 1
exports.b = 2
// console.log(module.exports) => { a: 1, b: 2 }

// 上面用法均正确,以下用法错误
exports = {a:1,b:2}
// console.log(module.exports) => {}

相关文章

  • ES6学习笔记 II

    模块化 注意:模块化需要放到服务器环境使用模块化: 定义模块化如下 export export const a =...

  • 前端开发——模块化(css模块化开发)

    掌握模块化开发的思想是我们进行模块化开发的基础。他有以下几部分组成: 模块化开发的优势 css模块化 css模块化...

  • Node.js模块化学习

    模块化的基本概念Node.js 中模块化npm与包模块的加载机制 模块化的基本概念 什么是模块化 模块化是指解决一...

  • webpack基础笔记

    webpack基础 1.前端工程化 实际的前端开发: 模块化:(js的模块化,css的模块化,资源的模块化) 组件...

  • 模块化开发

    js模块化开发vue模块化开发

  • Vue前端工程化

    1.模块化的分类 A.浏览器端的模块化 B.服务器端的模块化 C.ES6模块化 小结:推荐使用ES6模块化,因为A...

  • 前端工程化

    1.模块化的分类 A.浏览器端的模块化 B.服务器端的模块化 C.ES6模块化 小结:推荐使用ES6模块化,因为A...

  • vue5

    es6新内容 class 解构赋值 扩展对象 模块化 什么是模块化 模块的作用 怎么实现模块化 模块化的标准 Co...

  • Vue基础教程之-组件核心概念(四)

    一、模块化 1.1 为什么需要模块化 没有模块化的世界:全局变量污染、难以管理的依赖。常见的模块化标准:Commo...

  • vue项目基建

    路由模块化 , 高频全局组件模块化 权限

网友评论

      本文标题:模块化

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