javascript 编码规范

一.命名
命名的方法通常有以下几类: 
a).命名法说明
1).camel命名法,形如thisIsAnApple 
2).pascal命名法,形如ThisIsAnApple
3).下划线命名法,形如this_is_an_apple · 
4).中划线命名法,形如this-is-an-apple 
根据不同类型的内容,必须严格采用如下的命名法: 
b).变量名:必须使用camel命名法
c).参数名:必须使用camel命名法 
d).函数名:必须使用camel命名法
e).方法/属性:必须使用camel命名法
f).私有(保护)成员:必须以下划线_开头
g).常量名:必须使用全部大写的下划线命名法,如IS_DEBUG_ENABLED
h).类名:必须使用pascal命名法
i).枚举名:必须使用pascal命名法 
j).枚举的属性:必须使用全部大写的下划线命名法
k).命名空间:必须使用camel命名法 
l).语义:命名同时还需要关注语义,如: 变量名应当使用名词; 
boolean类型的应当使用is、has等起头,表示其类型;· 
函数名应当用动宾短语;

类名应当用名词

get 获取/set 设置,                                add 增加/remove 删除
create 创建/destory 移除                     start 启动/stop 停止
open 打开/close 关闭,                         read 读取/write 写入
load 载入/save 保存,                           create 创建/destroy 销毁
begin 开始/end 结束,                           backup 备份/restore 恢复
import 导入/export 导出,                     split 分割/merge 合并
inject 注入/extract 提取,                      attach 附着/detach 脱离
bind 绑定/separate 分离,                    view 查看/browse 浏览
edit 编辑/modify 修改,                         select 选取/mark 标记
copy 复制/paste 粘贴,                         undo 撤销/redo 重做
insert 插入/delete 移除,                       add 加入/append 添加
clean 清理/clear 清除,                         index 索引/sort 排序
find 查找/search 搜索,                         increase 增加/decrease 减少
play 播放/pause 暂停,                         launch 启动/run 运行
compile 编译/execute 执行,                debug 调试/trace 跟踪
observe 观察/listen 监听,                    build 构建/publish 发布
input 输入/output 输出,                       encode 编码/decode 解码
encrypt 加密/decrypt 解密,                 compress 压缩/decompress 解压缩
pack 打包/unpack 解包,                     parse 解析/emit 生成
connect 连接/disconnect 断开,          end 发送/receive 接收
download 下载/upload 上传,   refresh 刷新/synchronize 同步
update 更新/revert 复原,     lock 锁定/unlock 解锁
check out 签出/check in 签入,          submit 提交/commit 交付
push 推/pull 拉,         expand 展开/collapse 折叠
begin 起始/end 结束,                   start 开始/finish 完成
enter 进入/exit 退出,                  abort 放弃/quit 离开
obsolete 废弃/depreciate 废旧,          collect 收集/aggregate 聚集

全局命名空间污染与 IIFE
在全局范围中声明变量会导致全局范围的污染。将存储在window对象中。这是非常不洁净的,需要避免。

			var x = 10,
	    		y = 100;
			console.log(window.x + ' ' + window.y);					//10,100
推荐IIFE(立即执行的函数表达式)不仅避免了干扰,也使得内存在执行完后立即释放。
//执行括号写在内使得整个表达式看起来更像一个整体
			(function () {
				var x = 10,
	    		y = 100;
				console.log(window.x + ' ' + window.y);				//undefined,undedined
			})();
			//或
			!function () {
				var x = 10,
	    		y = 100;
				console.log(window.x + ' ' + window.y);				//undefined,undedined
			}();
			//引用全局变量或者是外层的变量,可以通过下列方式传参
			(function(log, w, undefined){
				
			  var x = 10,
			      y = 100;
			  
			  log((w.x === undefined) + ' ' + (w.y === undefined));	 //true true
			 
			}(window.console.log, window));
			

严格模式'use strict'
最好是在独立的 IIFE 中应用它。避免在你的脚本第一行使用它而导致你的所有脚本都启动了严格模式

		
			(function(){
			 'use strict';
			  // Your code starts here
			 
			}());
变量声明
如不指定 var,变量将被隐式地声明为全局变量
			(function(){
			 
			  	x = 10;
			  	y = 100;
			  	console.log(window.x,window.y);				//10 100
			  	
			  	
				var a = 10,
		    		b = 100;	
		    	console.log(window.a,window.b);				//undefined undefined
			}());
			
JavaScript 的定义域和定义域提升
闭包中使用的所有变量和函数都将被提升到函数的顶部

//原函数
			(function(log){
			  'use strict';
			 
			  var a = 10;
			 
			  for(var i = 0; i < a; i++) {
			    var b = i * i;
			  }
			 
			  if(a) {
			    var f = function() {	//函数赋值只会导致挂起的变量,但函数体不会被挂起
			    };
			  }
			 
			  function x() {	//只有通过使用真正的函数声明,整个函数才会被挂起
			  	
			  }
			}(window.console.log));
		
		//被 JS 提升过后
			(function(log){
			  'use strict';
			  // 闭包中使用的所有变量和函数都将被提升到函数的顶部
			  var a,			
			      i,
			      b,
			      f;
			  function x() {
			    log('Mr. X!');
			  }
			 
			  a = 10;
			 
			  for(i = 0; i < a; i++) {
			    b = i * i;
			  }
			 
			  if(a) {
			  	
			    f = function() { //函数赋值只会导致挂起的变量,但函数体不会被挂起
			    };
			  }
		 
			}(window.console.log));
			
			//我们应该手动地显示地去声明变量与方法。也就是说,所有的变量以及方法,应当定义在 function 内的首行。
			(function(log){
			  'use strict';
			 //只用一个 var 关键字声明,多个变量用逗号隔开,在声明的同时进行赋值
			  var a = 10,
			      b = 10,
			      i,
			      c,
			      d,
			      x;
			 
			  function f() {
			 
			  }
			}());
			
	
语句块内的函数声明,函数声明应该在定义域的顶层,但在语句块内可将函数声明转化为函数表达式赋值给变量。
		if (x) {
		  function foo() {}
		}
		//推荐
			if (x) {
			  var foo = function() {};
			}
			
标准特性优先
为了最大限度地保证扩展性与兼容性,总是首选标准的特性,而不是非标准的特性

		var string = 'ewrqwew';
		//选用
		string.charAt(3);
		//而不是 
		string[3];
	
eval() 不但混淆语境还很危险,
总会有比这更好、更清晰、更安全的另一种方案来写你的代码

eval();		//因此尽量不要使用 evil 函数。
首选函数式风格
函数式编程让你可以简化代码并缩减维护成本,因为它容易复用,又适当地解耦和更少的依赖

//建议使用 ECMA Script 5 中新增的语法糖和函数。这将简化你的程序,并让你的代码更加灵活和可复用。
		(function(log){
		  'use strict';
		 
		  var arr = [10, 3, 7, 9, 100, 20];
		 
		  var sum = arr.reduce(function(prevValue, currentValue) {
		    return prevValue + currentValue;
		  }, 0);
		 
		  log('The sum of array ' + arr + ' is: ' + sum);
		 
		}(window.console.log));
		//例外:往往在重代码性能轻代码维护的情况之下,要选择最优性能的解决方案而非维护性高的方案(比如用简单的循环语句代替 forEach)。
	
	//用 ECMA5 的迭代方法来迭代数组
	  (function(log){
		  'use strict';
		 
		  // 如果你要在特殊场合下中断迭代,那就用 Array.every
		  [1, 2, 3, 4, 5].every(function(element, index, arr) {
		    log(element + ' at index ' + index + ' in array ' + arr);
		 
		    if(index !== 5) {
		      return true;
		    }
		  });
		 
		  // 迭代一个对象
		  var obj = {
		    a: 'A',
		    b: 'B',
		    'c-d-e': 'CDE'
		  };
		 
		  // Iterating over the object keys
		  Object.keys(obj).forEach(function(element, index, arr) {
		    log('Key ' + element + ' has value ' + obj[element]);
		  });
		 
	  }(window.console.log));
	
不要使用 switch
switch 在所有的编程语言中都是个非常错误的难以控制的语句,建议用 if else 来替换它。

注:有争议,还需要根据不同的使用环境具体分析,一般情况下switch比if else 效率来的更高
数组和对象字面量
用数组和对象字面量来代替数组和对象构造器。数组构造器很容易让人在它的参数上犯错。

  	
  	//不推荐
	  	var arr = new Array(3,1);
	  	var arr = new Array(3);
  	
  	//推荐
  		var arr = [3];
  		
  	//对象构造器不会有类似的问题,为了可读性和统一性,用字面量写
	  	var o2 = {
		  a: 0,
		  b: 1,
		  c: 2,
		  'strange key': 3
		};
		
修改内建对象的原型链
修改内建的诸如 Object.prototype 和 Array.prototype 是被严厉禁止的。
修改其它的内建对象比如 Function.prototype,虽危害没那么大,
但始终还是会导致在开发过程中难以 debug 的问题,应当也要避免。

字符串
统一使用单引号(‘),不使用双引号(“)。这在创建 HTML 字符串非常有好处:

    var msg = 'This is some HTML <div class="makes-sense"></div>';
三元条件判断(if 的快捷方法)
用三元操作符分配或返回语句。在比较简单的情况下使用,避免在复杂的情况下使用。

    if(x === 10) {
	  return 'valid';
	} else {
	  return 'invalid';
	}
	
	//推荐
	return x === 10 ? 'valid' : 'invalid';
	
对齐缩进与换行

缩进 : 提倡缩进大小为4个空格
换行 :每个独立语句结束后;if、else、catch、finally、while等关键字前;


 return

return如果用表达式的执行作为返回值,请把表达式和 return 放在同一行中,以免换行符被误解析为语句的结束而引起返回错误。return 关键字后若没有返回表达式,则返回 undefined。

构造器的默认返回值为 this。



"//"用作代码行注释
"/* .... */"形式用作对整个代码段的注销,或较正式的声明中
如 : 函数参数、功能、文件功能等的描述中:

每句代码后(必须)加";"
这个是要引起注意的,比如:

		a = b        // 赋值
		(function(){
	    	//....
		})()         // 自执行函数
				
		a = b(function(){
			
			//...
			
			})()	//将b()()返回的结果赋值给a
	

转至:

http://javascript.ruanyifeng.com/grammar/function.html
http://www.cnblogs.com/hustskyking/p/javascript-spec.html












  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值