Javascript如何模块化编程

来源：动视网责编：小采时间：2020-11-27 20:13:06

Javascript如何模块化编程

Javascript如何模块化编程:模块化编程可以让业务的逻辑更加清楚。与其他传统编程语言不同，Javascript并没有提供原生的、有组织的引入模块方式。这里主要探讨下：基于对象的Javascript模块化编程。即javascript 模块化（package.类.方法）。传统的写法：在一个Javascript文件

推荐度：

点击下载本文 文档为doc格式

导读Javascript如何模块化编程:模块化编程可以让业务的逻辑更加清楚。与其他传统编程语言不同，Javascript并没有提供原生的、有组织的引入模块方式。这里主要探讨下：基于对象的Javascript模块化编程。即javascript 模块化（package.类.方法）。传统的写法：在一个Javascript文件

模块化编程可以让业务的逻辑更加清楚。与其他传统编程语言不同，Javascript并没有提供原生的、有组织的引入模块方式。这里主要探讨下：基于对象的Javascript模块化编程。即javascript 模块化（package.类.方法）。

传统的写法：

在一个Javascript文件中将不同的函数杂糅在一起，比如：

function m1(arg1, arg2){
	//…
}
function m2(){
	//…
}

这种方式“污染”了全局变量，且不能保证不发生冲突，最重要的是模块与成员间的关系不明显。

对象的写法：

将不同的模块写成不同的对象，所有模块成员放在对象里面。

var module1 = new Object({
	_appId : 0,
	URL:{
	process1:function(){
	return ‘/data/process1’;
	}，
	process2:function(){
	return ‘/data/process2’;
	}
},
	m1: function(){
	//…
},
m2:function(params){
	var appId = params[‘appId’];
	var package = params[‘package’];
	//…
},
m3:{
	init:function(){
	//initial something
	},
	process:function(appId, package){
	//
	}
}
});

分析：

下面的写法：

var module1 = new Object({
	//…
})

可以简写为：

var module1 = {
	//…
}

常量相关的设置：

_appId: 0,

可以将设置某些常量值，这个常量还可以用来传递el表达式的值，在jsp文件中，添加

<script type=”text/javascript”>
	module1._appId = ${appId}; //这样可以将服务端的appId的值设置到js中
</script>

注意：

EL表达式${appId}只能在jsp文件中使用，不能在js文件中使用。

另一种设置常量组的方式为：

URL:{
	process1:function(){
	return ‘/data/process1’;
	}，
	process2:function(){
	return ‘/data/process2’;
	}
},

函数中变量的传递方式有两种方式：

1)比较简单的是：

process:function(appId, package)

这里appId和package即为传递的单层值。

2)数组传递：

m2:function(params){
	var appId = params[‘appId’];
	var package = params[‘package’];
	//…
},

调用的时候格式如下：

module1.m2({appId:10, package:’hello’})

多层对象封装：

m3:{
	init:function(){
	//initial something
	},
	process:function(appId, package){
	//
	}
}

Javascript如何模块化编程

推荐度：

点击下载本文 文档为doc格式

标签：如何 js 模块

热门焦点

Javascript如何模块化编程

Javascript如何模块化编程

Javascript如何模块化编程

最新推荐

猜你喜欢

热门推荐