什么是模块化,模块化开发如何实现?
相信广大前端朋友们都遇到过这么一个问题? 什么是模块化,模块化开发如何实现?
那么什么是模块化呢,时下流行的库与框架又有哪些在利用模块化进行开发呢?
今天我从以下两个方向来进行描述,如果描述不够准确,还请各位多多指正。
1.什么是模块化?
模块化就是讲js文件按照功能分离,根据需求引入不同的文件中。源于服务器端。
在前段开发中,最先出现在node.js中,commne.js中(module.exports和require)随着web应用的模块化,在浏览器端页是需要进行模块化开发,早期AMD,CMD规范,代表Require.js和sea.js。在es6中,提出了原生模块呼哈的解决方案,就是export和import但是浏览器并没有完全支持,需要借助一些工具,--babel,实现这个转换的有browserify和webpack。
在node.js中,模块就是一个文件,通常js、json文件,包是多个模块的集合,类似文件夹。
模块化通俗点的理解就是这样:就像我们小时候拼积木一样。我们想拼一个房子出来,我们不是一下子从低到顶逐渐的拼出来。而是我们把一个横条,竖条,圆圈等拼凑在一起,形成一个窗户,一面墙,房顶等等部件。这些部件就如同是一个个模块一样。具备一定的功能,可以单独分开使用。不同的框架和库的模块,有很多功能类似,可以理解为你的积木是塑料的,他的是木头的,只要接口Api可以对的上,那么也可以通用。
2.Node.js中的模块:Angular.js中的模块:React.js中的模块:有何异同?
nodejs里的模块,就是一个文件,通常js、json文件。
Angularjs里的模块就是一系列配置和代码块的集合,它们是在启动阶段就附加到应用上的。一个最简单的模块由两类代码块集合组成的:
配置代码块 - 在注入提供者注入和配置阶段执行。只有注入提供者和常量可以被注入到配置块中。这是为了防止服务在被配置好之前就被提前初始化。
运行代码块 - 在注入器被创建后执行,被用来启动应用的。只有实例和常量能被注入到运行块中。这是为了防止在运行后还出现对系统的配置。
Reactjs里的模块/组件:就是将一段js、html、css组合在一起,形成有一定功能的代码片段
什么是模块化,模块化开发如何实现?相关推荐
- python程序开发模块化_python-17-Python文件两种用途、模块化程序开发
--------------------------------python文件的两种用途---------------------------------- py文件的两种用途: 1.直接运行 pr ...
- C#中的模块化软件开发
目录 介绍 规格类型 模块 没有模块开发 模块化编程 谓词和类型 契约 类型化编程 接口和抽象 其他语言的签名 介绍 软件设计提升了一系列编程质量: 抽象:表示程序各部分的能力,包括其基本特征的摘要. ...
- 分布式模块化 Java 开发平台 Castle-Platform
Castle-Platform是一个分布式.模块化的开发平台,目标是打造高性能.高扩展性的开发平台,完成通用的管理功能.采用了后台管理集中部署,会员业务系统可分离部署等特点,可独立区分后台管理系统.前 ...
- 编程思想-模块化-模块化设计:模块化设计
ylbtech-编程思想-模块化-模块化设计:模块化设计 模块化设计,简单地说就是程序的编写不是开始就逐条录入计算机语句和指令,而是首先用主程序.子程序.子过程等框架把软件的主要结构和流程描述出来,并 ...
- 编程思想-模块化-模块化程序设计:模块化程序设计
ylbtech-编程思想-模块化-模块化程序设计:模块化程序设计 模块化程序设计是指在进行程序设计时将一个大程序按照功能划分为若干小程序模块,每个小程序模块完成一个确定的功能,并在这些模块之间建立必要 ...
- 使用SeaJS实现模块化JavaScript开发
2019独角兽企业重金招聘Python工程师标准>>> 前言 SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加 ...
- 使用SeaJS实现模块化JavaScript开发【转】
前言 SeaJS是一个遵循CommonJS规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制.与jQuery等JavaScript框架不同,SeaJS不会扩展封 ...
- 模块化系统开发 一
为什么会有模块化系统,从我们提高班现有的系统:机房收费系统.教务系统.基础数据库系统.考试系统.评教系统.ERP系统等无外乎这些系统之间都涉及权限的灵活性配置.菜单的显隐的灵活.标签的动态加载.数据库 ...
- 前端学习(1290):nodejs模块化的开发导出另一种方式
demo04.js const greeting = _name => `hello ${_name}`;module.exports.greeting = greeting; demo05.j ...
- 前端学习(1289):nodejs模块化的开发规范
demo02.js const add = (n1, n2) => n1 + n2exports.add = add; demo03.js const a = require('./demo02 ...
最新文章
- 超强PHP集成环境,支持800多个不同PHP版本同时运行,无限自定义添加mysql与php版本...
- SQL CREATE TABLE 语句(转)
- 开发连接mysql_VC连接Mysql及开发详细指南
- access无法 dolby_如何解决windows 8无法开启杜比音效的问题
- C++ class实现双向循环链表(完整代码)
- __set() And __get() 使用详解.
- hping3 应用笔记
- cad2004教程_天正2014软件安装教程及下载地址
- matlab调和均值滤波_求matlab均值滤波、中值滤波和领域平均滤波算法
- 华为Mate30安装google play服务最全方法
- LTE相关协议2——下行峰值速率计算
- Python获取多核CPU温度 均值
- 炸鸡块君与FIFA22 线段树(牛客)
- linux和尚取水设计,小和尚取水
- 线性代数笔记21——伴随矩阵和克莱姆法则
- PHP 中的设计模式详解
- excel表格经纬度同表格分成经度纬度两个表格
- OpenGL with QtWidgets:练习之扑克翻转
- 校园答题网站服务器,校园竞赛答题软件-公园答题软件
- 如何优化网站关键词?
热门文章
- 西门子大型程序fanuc机器人焊装 包括1台 西门子1500PLC程序,2台触摸屏TP1500程序
- 学习笔记(2):华为工程师,带你实战C++视频精讲-Day1王桂林老师原创视频-C到C++类型安全增强...
- 关于win7 打kb4012212补丁失败问题。
- Android换肤:从外存中读取皮肤包资源实现换肤
- Verilog 语言编写 OV7725摄像头初始化寄存器库与模块的初始化
- ESB Evaluation
- 美国计算机科学就业率,美国计算机就业率最高的30所大学
- BZOJ2251: [2010Beijing Wc]外星联络
- 计算机毕业设计springboot基于vue众筹平台系统 aj3l6源码+系统+程序+lw文档+部署
- 华为3C刷机ROOT 一键ROOT必备工具