模块化开发(一)

1、Node.js解决命名冲突和文件依赖的问题。

2、模块化开发的优点:

生产角度:一种生产方式,生产效率高,维护成本低

软件开发角度:一种开发模式,一种写代码的方式,开发效率高,方便后期维护

3、什么是模块化开发?

模块化:就是把一个非常复杂的一个系统给具体的细化:细化到各个小功能点,然后通过某种方式,或者说某种规则,把这些模块集合到一起,就构成了模块化系统

4、模块化演变:

全局函数:全局变量污染,无法保证不与其他模块发生变量命名冲突;模块成员之间看不出直接关系

对象命名空间:优点:从理论意义上减少了命名冲突。但是暴漏了所有的模块成员,内部状态可以被外部改写,不安全;并且命名空间越来越长

函数私有空间:

利用函数作用域机制实现了私有共有成员成员的分离

私有空间内的变量和函数不会影响全局作用域

jQuery、underscore 等都采用了这种方式

维护和开发:

当一个模块很大的时候,就需要将该模块分成几个部分

软件开发思想:开闭原则

对于扩展是开放的(应用需求变更的时候,可以对模块在不修改源代码的情况下扩展功能)

对于修改是关闭的(对模块的行为进行扩展时,不必改动模块的源代码)

第三方依赖:

依赖注入

降低模块之间的耦合度

模块职责要保持单一性

通过在参数中注入依赖项的方式体现出了模块之间的依赖关系

5、例如:_count   这种以下滑来命名的一般表示的是对象的私有属性,规范就是不想被外部所访问。

6、大部分第三方库都是使用匿名函数自执行的方式来实现模块化,更好的解决冲突和私有空间问题。

7、模块扩充的方法:

var ob= (

function 1 () {}

function 2 () {}

var a ;

......

return {

1 : 1,

2 : 2,

a : a,

......

)()

var ob = (function(o){

o.f1 =function (){}

return  o

}

)(ob || {})

8、模块化的理解:

CSS中的模块化:

a. @import url(‘./././‘)

b. 相当于seaJs 中的 requires

时间: 2024-10-27 06:14:51

模块化开发(一)的相关文章

2.精通前端系列技术之JavaScript模块化开发

在使用seajs模块化开发之前,直接在页面引用js会容易出现冲突及依赖相关的问题,具体问题如下 问题1:多人开发脚本的时候容易产生冲突(比如全局参数冲突,方法名冲突),可以使用命名空间降低冲突,不能完全避免冲突 // JavaScript Document /*var a = 10; function tab(){} function drag(){} function dialog(){}*/ var miaov = {}; //名字比较长 , 只能降低冲突,不能完全避免 miaov.a =

UC前端‘搭积木’的模块化开发——scrat.js

模块化开发 将模块所需的js\css\img\tmpl维护在一起,一个模块一个目录 js渲染模板 css只关心模块内样式 开发团队心声:"我们希望每次研发新产品不是从零开始,不同团队不同项目之间能有可复用的模块沉淀下来." 模块生态 每个工程有_工程模块_和_生态模块_. 生态模块:基于_component规范_开发,部署到Github上,可以通过命令行工具将Github上的模块安装到工程中使用.比如:jQuery, iscroll, zepto.js, vue.js 安装命令: sc

关于Egret模块化开发---vip系统

关于Egret模块化开发---vip系统 目录 关于Egret模块化开发---vip系统... 1 前言... 1 一,搭建界面... 1 二,建立数据模型... 3 1)数据模型的搭建: 3 2)数据的建立... 4 3)数据的增删改查... 7 三.做交互, 7 结束... 8 前言 做游戏就是做数据,数据模型的设计,是体验mvc一种基础的设计,用数据驱动界面变化.. 做为一个程序要学会模块化,配置化,脚本化的需求,提防策划的需求变更的可能 例如:做一个VIP系统步骤: 搭建界面 建立数据模

javascript模块化开发编程

随着网站的不断迭代更新,js代码越来越多,那么问题来了 代码比较乱 命名出现冲突 文件依赖比较繁杂 为了解决以上问题,模块化开发出现了 1.一个简单的demo,维护和扩展模块 模块的维护和扩展一定要遵守一个约定:开闭原则 对添加开放,对修改封闭 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>扩展和维护模块</

前端模块化开发的价值

本文发表在<程序员>杂志 2013 年 3 月刊,推荐购买. 前端模块化开发的价值 随着互联网的飞速发展,前端开发越来越复杂.本文将从实际项目中遇到的问题出发,讲述模块化能解决哪些问题,以及如何使用 Sea.js 进行前端的模块化开发. 恼人的命名冲突 我们从一个简单的习惯出发.我做项目时,常常会将一些通用的.底层的功能抽象出来,独立成一个个函数,比如 function each(arr) { // 实现代码 } function log(str) { // 实现代码 } 并像模像样地把这些函

轻轻谈一下seaJs——模块化开发的利器

"仅做一件事,做好一件事." 这个应该就是seaJs的精髓了. 我在自己的一些项目中使用过seaJs,对其算是了解一二,现在就班门弄斧,轻轻地谈一下. 首先上一段度娘的话: "seaJs是一个遵循CommonJs规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制.与jQuery等JavaScript框架不同,SeaJS不会扩展封装语言特性,而只是实现JavaScript的模块化及按模块加载.SeaJS的主要目的是令JavaScript开

Javascript模块化开发 – AMD规范

通行的Javascript模块规范共有两种:CommonJS和AMD. 2009年,美国程序员Ryan Dahl创造了node.js项目,将javascript语言用于服务器端编程.这标志"Javascript模块化编程"正式诞生.因为老实说,在浏览器环境下,没有模块也不是特别大的问题,毕竟网页程序的复杂性有限:但是在服务器端,一定要有模块,与操作系统和其他应用程序互动,否则根本没法编程. node.js的模块系统,就是参照CommonJS规范实现的.在CommonJS中,有一个全局性

软件开发中,什么是模块化开发?

软件产品可以被看作是由一系列具有特定功能的组件组成,作为一个完整的系统也可以被分解成一系列功能模块,这些模块之间的相互作用就形成了系统的所有功能. 所谓模块是指可组成系统的.具有某种确定独立功能的半自律性的子系统,可以通过标准的界面和其他同样的子系统按照一定的规则相互联系而构成的更加复杂的系统.每个模块的研发和改进都独立于其他模块的研发和改进,每个模块所特有的信息处理过程都被包含在模块的内部,如同一个"黑箱",但是有一个或数个通用的标准界面与系统或其他模块相互连接. 在软件的模块化开发

seajs的模块化开发--实践笔记

2017-04-02 SeaJS是一个遵循CMD规范的JavaScript模块加载框架,可以实现JavaScript的模块化开发及加载机制.有效的解决复杂项目中命名冲突.依赖.性能等问题. SeaJS中使用define函数定义一个模块.define可以接收三个参数:require, exports, module. require--模块加载函数,用于记载依赖模块. exports--接口点,将数据或方法定义在其上则将其暴露给外部调用. module--模块的元数据. SeaJS的基本用法有以下

Angular 结合RequireJs实现模块化开发

angular的指令是模块化很好的一个体现,下面我将只使用指令(不用控制器),结合requirejs,实现模块化开发. 模块化关系图: 传统开发方式 <!--aaa模块--> <div> <h3>this is aaa</h3> <input type="text" ng-model="asd">{{asd}} <button ng-click="submit()">subm