规避Javascript多人开发函数和变量重名问题
函数和变量重名始终是一个令人头痛的问题,先讲变量吧,相信了解JS的朋友都知道,在JS中
是没有块级作用域的只有函数作用域,也就是说那些以大括号为界定符的代码块是管不住其中定义
的变量的作用域的,举例:
1 {
2 var num = 110;
3 }
4 console.log(num);//打印结果:110,而不是num is not defined
1 for(var j = 0; j < 5; j++);
2 console.log(j);//结果:5
怎么解决? 一般来说有经验的程序员会尽量少的使用全局变量,尽可能使用局部变量,这不仅会减少变量重名的几率,
更会减少内存开销,因为局部变量一般都会在函数结束后自动销毁释放出内存,而全局变量会直到进程结束才会被销毁
掉。其次,当我们需要一个作用域来关住变量时一般会用一个匿名函数来充当这个作用域。如:
1 (function(){
2 var gender = '男';
3 })();
4 console.log(gender);//结果是:gender is not defined
匿名函数充当作用域这种方法一般已经能够满足一部分程序员的需求了,但问题来了,函数重名怎么解决?
项目中必须要使用大量全局变量又该如何解决呢?
其实解决办法跟上面方法的思路一样,只是有一点技巧性,JS既然缺少作用域限制,那我们自己再给它人为加上一个
作用域,并且保证每个作用域不重复,这样一来问题不就解决了吗。好了接下来我们缺少的就是这么一个神奇的作用域
替代品,令人开心的是,这个东西本身JS就有,那就是对象!
具体我们可以这么操作:假如现在有三个同学要一起合作一个教务系统的项目,这个系统需要老师和学生还有工作人员
的信息,三个同学分工解决这三类信息的工作,具体代码如下:
1 // A同学负责的工作人员信息
2 var A = {} //定义一个空对象
3 A.name = 'tom';
4 A.gender = 'male';
5 A.age = 30;
6 A.showName = function() {
7 alert(this.name);
8 }
9 A.showAge = function() {
10 alert(this.age);
11 }
12
13 // B同学负责的老师信息
14 var B = {}
15 B.name = 'Jack';
16 B.gender = 'male';
17 B.age = 28;
18 B.showName = function() {
19 alert(this.name);
20 }
21 B.showAge = function() {
22 alert(this.age);
23 }
24
25 // C同学负责的学生信息
26 var C = {}
27 C.name = 'Lucy';
28 C.gender = 'female';
29 C.age = 17;
30 C.showName = function() {
31 alert(this.name);
32 }
33 C.showAge = function() {
34 alert(this.age);
35 }
可以看到,ABC同学负责的模块中都出现了同名的区域,name,age,showName,showAge等,此时却并不会
出现冲突的问题,因为这些变量和方法都挂载到了不同的对象上,这无形中就给每个同名变量和方法增加了一个
顶部命名空间,这样一来困扰我们的问题就可以很轻易的解决了。
1 // 正常使用,不会冲突
2 console.log(A.name);//结果:tom
3 console.log(B.name);//结果:Jack
4 console.log(C.name);//结果:Lucy
5 A.showAge();//结果:30
6 B.showAge();//结果:28
7 C.showAge();//结果:17
最有效的方法,还是采用面向对象开发吧,面向对象非常适合团队化开发,这样可以最大化的减少代码耦合的几率,项目也容易维护。
规避Javascript多人开发函数和变量重名问题的更多相关文章
- 规避javascript多人开发函数重名问题
命名空间 封闭空间 js模块化mvc(数据层.表现层.控制层) seajs 变量转换成对象的属性 对象化
- 如何规避javascript多人开发函数重名问题
命名空间 封闭空间 js模块化mvc(数据层.表现层.控制层) seajs(如果了解的呢,可以说) 变量转换成对象的属性 对象化
- javascript函数中变量重名
<script type="text/javascript"> function fun(a){ console.log(a); // function var a=1 ...
- linker command failed with exit code 1 (use -v to see invocation) 变量重名
有时候,xcode报错看不到,点最后一个按钮,类似气泡的就能看到 报错信息: duplicate symbol _imgNummmm in: /Users/mianmian/Library/De ...
- delphi with... do和自定义变量重名
with类中的变量和外部变量如果重名,会将外部变量覆盖,这点需要注意!!!!!
- ZH奶酪:JavaScript调用AngularJS的函数/$scope/变量
使用背景: 需要在其他JavaScript文件中调用AngularJS内部方法或改变$scope变量,同时还要保持双向数据绑定: 首先获取AngularJS application: 方法一:通过co ...
- Python使用property函数定义的属性名与其他实例变量重名会怎么样?
首先如果定义的属性名与该属性对应的操作方法操作的实例对象同名就会触发无穷的递归调用,相关部分请参考<Python案例详解:使用property函数定义与实例变量同名的属性会怎样?> 但如果 ...
- c语言全局变量与局部变量(当变量重名时)的使用情况
在c语言中,变量有全局变量和局部变量之分,这一点和很多高级语言类似,如c#,java等.不过与c#,java中的局部变量如在全局变量作用域内则不允许与全局变量名相同,而c语言是允许这样做的.这样的做法 ...
- shell脚本变量定义注意别跟系统变量重名了……
写了个很简单的脚本,执行结果却很奇怪. 1 #!/bin/bash PATH=$HOME/vlc_transplant4 rm -f $PATH/vlc ln -s $PATH/bin/vlc-s ...
随机推荐
- 设置session超时的三种方式
设置session超时的三种方式 1. 在容器中设置:如在tomcat-7\conf\web.xml中设置 Tomcat默认session超时时间为30分钟,可以根据需要修改,负数或0为不限制sess ...
- HIVE的sql语句操作
Hive 是基于Hadoop 构建的一套数据仓库分析系统,它提供了丰富的SQL查询方式来分析存储在hadoop 分布式文件系统中的数据,可以将结构 化的数据文件映射为一张数据库表,并提供完整的SQL查 ...
- Visual Paradigm for UML 10.0 SP1 企业中文下载地址、安装及激活详解教程
https://blog.csdn.net/u013354805/article/details/46531833
- CSS深入理解学习笔记之border
1.border-width border-width为何不支持百分比:语义和使用场景决定的,现实中各种边框本身的概念就不存在百分比的使用方法. border-width支持关键字:thin.medi ...
- Android 时间范围选择器PickTimeDialog
个人提供了自己封装的第三方时间选择器,能够自定义时间格式,以及设置时间范围. 基础使用 PickTimeDialog pickDilog= new PickTimeDialog(this).setMa ...
- Android SharedPreferences存储数据
SharedPreferences是Android中最容易理解的数据存储技术,实际上SharedPreferences处理的就是一个key-value(键值对)SharedPreferences常用来 ...
- Android 第三方类库简单使用之EventBus
Android 第三方类库之EventBus 1 PS 工欲善其事必先利其器. Eventbus也是一款在开发中常用的利器 这篇也对EventBus的简单介绍和使用,与之前个xutils介绍的级别一样 ...
- css 字体样式设置
css字体样式(Font Style),属性 时间:2014-05-08 21:49 来源:我爱学习网 | 作者:我爱学习网 | 本文已影响 68353 人 css字体样式(Font Style) ...
- Ruby系列文章之1---开发者应该熟悉的10个工具
1. Git Git是进入Ruby这个生态圈首先最应该学会的工具.几乎所有以Ruby开发出来的套件都放在Github上.也就是不管你要下载或修改协作都需要透过Git. 2. RVM Ruby有很多种i ...
- Flask入门文件上传flask-uploads(八)
1 视图传递多个参数 (1) 普通传参 : 关键字参数传递 return render_template('模板名称.html',arg1=val1,arg2=val2...) (2) 字典传参 : ...