根据《编写高质量代码改善JavaScript程序的188个建议》这本书,来记录我目前所了解的建议方式。

建议1:警惕Unicode乱码

  1. 根据ECMA标准规定JavaScript语言可以使用中文来命名变量或函数名,例如:
  2.  
  3. var 人名 = “张三”;
  4. function 睡觉(谁){
  5. alert(谁 + ":快睡觉!都半夜三更了。");
  6. }
  7.  
  8. 睡觉(人名);
  9.  
  10. 但是在ECMA标准化之前,JavaScript通常是不支持Unicode编码的,为了防止乱码,我们应该尽量使用基本字符进行编码。

建议1

建议2:正确辨析JavaScript句法中的词、句和段

  1. {
  2. //对象
  3. }
  4.  
  5. function(){
  6. //函数
  7. }
  8.  
  9. if(){
  10. //条件
  11. }
  12.  
  13. for(){
  14. //循环
  15. }
  16.  
  17. while(){
  18. //循环
  19. }
  20.  
  21. switch(){
  22. //多条件
  23. }
  24.  
  25. with(){
  26. //作用于
  27. }
  28.  
  29. try(){
  30. //异常处理
  31. }

建议2

建议3:减少全局变量污染

  1. 在任何函数外面直接执行var语句
  2. var f = value”;
  3.  
  4. 直接添加一个属性到全局对象上,全局对象是所有全局变量的容器,在Web浏览器中,全局对象名为window
  5. window.f = value”;
  6.  
  7. 直接使用未经声明的变量,以这种方式定义的全局变量被称为隐式的全局变量
  8. f = value”;

建议3

建议4:注意JavaScript数据类型的特殊性

  1. 1.防止浮点数溢出
  2.  
  3. num = 0.1+0.2; //0.3000000000000000004
  4.  
  5. 针对上面相加可以这么进行处理:
  6.  
  7. a = (1+2)/10; //0.3
  8.  
  9. 2.慎用JavaScript类型自动转换
  10.  
  11. 3.正确检测数据类型
  12.  
  13. 4.避免误用parseInt
  14.  
  15. parseInt("123abc"); //123 parseInt("1.73"); //1 parseInt(".123"); //NAA
  16.  
  17. var d = "010"; //八进制 var e ="0x10"; //十六进制 parseInt(d); //8 parseInt(e); //16

建议4

建议5:防止JavaScript自动插入分号

  1. JavaScript会在解析时,自动在后面插入一个分号,但是在某些情况下是不允许插入分号的,否则会导致代码出错,例如:
  2.  
  3. var f = function(){return{status : true};
  4.  
  5. JavaScript 应该正确安全的实行 分行 显示,例如
  6.  
  7. var i = a ? 1 : b ? 2 : c ? 3 : 4; //定义一个变量i,然后为其赋值,如果变量a为true则赋值为1,否则就判断变量b,如果b为true则赋值为2,否则就判断变量c,如果c为true则赋值为3,否则就赋值为4
  8.  
  9. 应该写成
  10.  
  11. var i = a ? 1
  12. :b ? 2
  13. :c ? 3
  14. :4 ;

建议5

建议6:正确处理JavaScript特殊值

建议7:小心保留字的误用

  1. Javascr不建议使用任何保留字。如果一定要使用保留字,必须要用引号括起来,例如
  2.  
  3. object = {'case' : value};
  4.  
  5. object['case'] = value;

建议7

建议8:谨慎使用运算符

  1. 1. ===,而不用 ==
  2.  
  3. ' ' == 0 //false
  4. 0 == ' ' //true
  5. 0 == '0' //true
  6. false == 'false' //false
  7. false == '0' //true
  8. falser == undefined //false
  9. false == null //false
  10. null == undefined //true
  11.  
  12. 2.谨慎使用 ++ --
  13.  
  14. var n = 4;
  15. n++;
  16. ++n;
  17.  
  18. 3.小心逗号运算符
  19.  
  20. var a = (1,2,3,4);
  21. alert(a); //4
  22.  
  23. a=1,2,3,4;
  24. alert(a); //1

建议8

建议9:不要信任 hasOwnProperty

20

建议10:谨记对象非空特性

21

建议11:慎重使用伪数组

21

建议12:避免使用with

22

建议13:养成优化表达式的思维方式

  1. 对于一个表达式稍加改动就会打乱表达式的逻辑运算顺序,因此我们应该学会优化表达式的结构。
  2.  
  3. 1.第一种方式--加小括号
  4.  
  5. (a + b > c && a - b < c || a > b > c);
  6.  
  7. 优化:
  8.  
  9. ((a + b > c) && ((a - b < c) || (a > b > c)));
  10.  
  11. 2.第二种方式--改变表达式结构顺序
  12.  
  13. 例如,想要设计一个表达式来筛选学龄人群,既年龄大于或等于6岁且小于18岁的人,或者年龄大于或等于65岁的人
  14.  
  15. if(age >= 6 && age < 18 || age >= 65){}
  16.  
  17. 优化:
  18.  
  19. if(6 <= age && age < 18 || 65 <= age){}

建议13

建议14:不要滥用eval

  1. eval是一个被滥用的很严重的JavaScript特征,通常情况下,eval函数传递一个字符串给JavaScript编译器,该字符串会被当成一段JavaScript程序来解析和执行,例如
  2.  
  3. eval(alert('提示'));
  4.  
  5. 使用eval形式的代码会更难阅读,而且会使代码性能显著降低。

建议14

建议15:避免使用continue

  1. continue语句与break语句用法相似,在循环结构中用于控制逻辑的执行方向。break语句用于停止循环,而continue语句则用于再次执行循环,与break语句语法相同。
  2.  
  3. 书上讲到,通过重构移动continue语句会使性能得到改善,在非必要条件下,建议不要使用continue语句。
  4.  
  5. 但是,那break呢,是不是也可以不使用,从而使代码性能得到改善。

建议15

建议16:防止switch贯穿

  1. 说白了,在写switch case break default的时候,在写case之后,因为并没有指明终点,所以一定要写break,不然会使代码发生连续贯穿现象。

建议16

建议17:块标签并非多余

  1. 在写if逻辑判断的时候,即使得到的条件只有一条,也应写上块标签,例如
  2.  
  3. if(0){
  4. if(1){
  5. alert(1);
  6. }
  7. }
  8. else{
  9. alert(0);
  10. }
  11.  
  12. 严格遵循规范,并始终使用代码块,会使代码更容易理解。

建议17

建议18:比较function语句和function表达式

建议19:不要使用类型构造器

建议20:不要使用new

建议21:推荐提高循环性能的策略

建议22:少用函数迭代

  1. 本地数组对象新增加了一个forEach方法,此方法遍历一个数组的所有成员。
  2.  
  3. JavaScript
  4.  
  5. items.forEach(function(value,index,array){
  6. process(value);
  7. });
  8. JQuery
  9.  
  10. $.each(items,function(index,value){
  11. process(value);
  12. });
  13.  
  14. 尽管基于函数的迭代使用起来非常便利,但是比基于循环的迭代更慢一些,每个数组项要关联额外的函数调用是造成速度慢的主要原因。因此,在非特殊需求下,不建议使用函数迭代。

建议22

建议23:推荐提高条件性能的策略

  1. //条件少
  2.  
  3. if(found){
  4. }else{
  5. }
  6.  
  7. //条件多
  8.  
  9. switch(color){
  10. case "red":
  11. break;
  12. case "blue":
  13. break;
  14.  
  15. case "brown":
  16. break;
  17.  
  18. default:
  19. }
  20.  
  21. 在大多数情况下,switchif运行更快,但是只有当条件体数量很大时才明显,它们之间主要性能区别在于,当条件体增加时,if性能负担增加的程度比switch更大,因此,在性能上讲,如果条件体少,应使用if,如果条件体多,应使用switch

建议23

建议24:优化if逻辑

  1. if(value <){
  2. }else if(value >5 && value <){
  3. }else{
  4. }
  5.  
  6. 可以看得出,如果条件体value大多在小于5的情况下,是最优的,但是在大于5且小于10之间,需要通过一次条件判断,如果大于10,就需要判断3次,所以,得根据情况写if逻辑

建议24

建议25:恰当选用if和switch

  1. 表达式的值是连续的线性判断,显然用if结构会更合适一些,例如:如果分数小于60,不及格,分数在60~75(不包括75),合格,分数在75~85(不包括85),良好,分数在85~100,优秀
  2.  
  3. if(score <){
  4. alert("不及格");
  5. }else if (60 <= score < 75){
  6. alert("及格");
  7. }else if (75 <= score < 85){
  8. alert("良好");
  9. }else if(85 <= socre <= 100){
  10. alert("优秀");
  11. }
  12.  
  13. 对于有限制的枚举数据,比如性别,使用switch结构会更高效,例如:
  14.  
  15. switch(sex){
  16. case "女“:
  17. alert("女士");
  18. break;
  19. case "男“:
  20. alert("男士");
  21. break;
  22. default:
  23. alert("请选择性别");
  24. }

建议25

建议26:小心if嵌套的思维陷阱

  1. 人的思维是很复杂的,一般遇到一些逻辑判断的时候,人们会
  2.  
  3. if(a){
  4. if(b){
  5. if(c){
  6. if(d){
  7. alert("所有条件都成立!");
  8. }
  9. else{
  10. alert("条件d不成立!");
  11. }
  12. }
  13. else{
  14. alert("条件c不成立!");
  15. }
  16. }
  17. else{
  18. alert("条件b不成立!");
  19. }
  20. }
  21. else{
  22. alert("条件a不成立");
  23. }
  24.  
  25. 一般可以采用排除法来优化上面例子
  26.  
  27. var t = true; //初始化为true
  28. if(!a){
  29. alert("条件a不成立!");
  30.  
  31. t=false;
  32. }
  33.  
  34. if(!b){
  35. alert("条件b不成立!");
  36.  
  37. t=false;
  38. }
  39.  
  40. if(!c){
  41. alert("条件c不成立!");
  42.  
  43. t=false;
  44. }
  45.  
  46. if(!d){
  47. alert("条件d不成立!");
  48.  
  49. t=false;
  50. }
  51.  
  52. if(t){
  53. alert("所有条件都成立!");
  54.  
  55. }
  56.  
  57. 排除法虽然有效地避免了条件结构的多重嵌套,并且更加符合人的思维模式,但是,也是有一定的局限性,在条件判断时,如果有一个发生错误,那就会终止,放弃后面的操作,如果仅仅是为了检查某个值的合理性,也就无所谓了,但是如果为了改变变量值和数据操作,那么直接放弃就会让后面的数据操作也无法进行,为了防止此类问题,可以再设计一个标志变量来跟踪整个操作行为。

建议26

建议27:小心if隐藏的Bug

  1. 很多程序员会犯过这样的低级错误:
  2. if(a = 1){
  3. alert(a);
  4. }
  5. 虽然它是一个合法的表达式,不会导致编译错误,但是由于此表达的返回值为非0数值,JavaScript会自动把它转化为true,因此这样的分支结构的条件永远成立。
  6. 为了防止出现这样低级而令人讨厌的错误,我们建议:
  7. if(1 == a){
  8. alert(a);
  9. }

建议27

建议28:使用查表法提高条件检测的性能

  1. 当有大量离散值需要测试时,使用ifswitch比使用查表法要慢得多,在JavaScript中查表法可通过数组或普通对象实现。
  2. 查表法访问数据,在条件体的数目很大时,查表法不仅非常快,而且当需要测试的离散值数量非常大时,也有办法保持代码的可读性。
  3. 例如,使用switch检测value值。
  4. switch(value){
  5. case 0:
  6. return result0;
  7. case 1:
  8. return result1;
  9. case 2:
  10. return result2;
  11. case 3:
  12. return result3;
  13. case 4:
  14. return result4;
  15. }
  16. 使用switch结构检测value值的代码所占的空间可能与switch的重要性不成比例,代码很笨重,整个结构可以用一个数组查询代替。
  17. var result = [result0,result1,result2,result3,result4]
  18. return results[value];

建议28

建议29:准确使用循环体

  1. 选择正确的循环体会有助于提高性能及用户体验,一般来讲,有四种循环方式。例如:
  2. 1.for(var i=0;i<;i++){//循环体}
  3. 2.var i=0; while(i<10){//循环体 i++;} //条件循环
  4. 3.var i=0;do{//循环体}while(i++ < 10); //至少循环一次
  5. 4.for(var prop in object){//循环体}
  6.  
  7. 其他循环体会比for in 循环快7倍,因此推荐这样做,除非需要对数目不详的对象属性进行操作,否则避免使用for in循环,例如,迭代遍历一个有限的、已知的属性列表,舒勇其他循环类型更快,具体的使用模式如下:
  8. var prop = ["prop1","prop2"],i=0;
  9. while(i<prop.length){ process(object[prop[i]]);}
  10.  
  11. if循环是有章可循的,我们可以很容易地预知循环的次数,每次循环的状态等信息。
  12. while循环根据特定条件来决定循环操作,由于这个条件是动态的,无法预知条件何时为tureflase
  13.  
  14. 因此,for结构尝尝呗用于有规律的重复操作,如数组、对象、集合。
  15. 对于对象的迭代操作,更适合用for in这种特殊的for循环来操作。
  16. 如果对条件有特殊要求的话,建议用while
  17. 如果至少要执行一次的话,建议用do while

建议29

建议30:使用递归模式

  1. 那么什么叫递归呢?所谓递归函数就是在函数体内调用本函数。
  2. 最简单的例子就是计算阶乘。01的阶乘都会被定义为1,更大的数的阶乘是通过计算1*1*...来求得的,每次增加1,直至达到要计算阶乘的那个数。
  3. function factorial(n){
  4. if(n<=1){
  5. return 1;
  6. }
  7. else{
  8. return n*factorial(n-1);
  9. }
  10. }

建议30

建议31:使用迭代

  1. 合并排序算法是最常用的以递归实现的算法。
  2. function merge(left,right){
  3. var result=[];
  4. while(left.length>0&&right.length>0){
  5. if(left[0]<right[0]){
  6. result.push(left.shift());
  7. }else{
  8. result.push(right.shift());
  9. }
  10. }
  11. return result.concat(left).concat(right);
  12. }
  13.  
  14. function mergeSort(items){
  15. if(items.length == 1){
  16. return items;
  17. }
  18. var middle = Math.floor(items.length/2),
  19. left = items.slice(0,middle),
  20. right = items.slice(middle);
  21. return merge(mergeSort(left),mergeSort(right));
  22. }
  23.  
  24. 这个合并排序代码相当简单直接,其中mergeSort()函数被调用得非常频繁,对一个超过1500项的数组进行操作,就可能在Firefox上导致栈溢出,这就说明递归不是最好的实现方法,合并排序算法还可以用迭代实现,例如:
  25. function mergeSort(items){
  26. if(items.length == 1){
  27. return items;
  28. }
  29. var work = [];
  30. for(var i = 0 , len = items.length; i<len; i++){
  31. work.push([items[i]]);
  32. }
  33. work.push([]);
  34. for(var lim = len; lim > 1; lim=(lim+1) / 2){
  35. for(var j = 0,k = 0; k<lim; j++,k+=2){
  36. work[j] = merge(work[k],work[k+1]);
  37. }
  38. work[j] = [];
  39. }
  40. return work[0];
  41. }

建议31

建议32:使用制表

建议33:优化循环结构

  1. 循环是最浪费资源的一种流程。循环结构中一点小小的损耗都会被成倍放大,从而影响程序运行的效率。
  2. 1.优化结构
  3. var a = true;
  4. for(var b = 1; b <; b++){ //循环结构
  5. if(a == true){
  6. //条件判断
  7. }
  8. }
  9. 很明显,在这个循环结构中if语句会被反复执行,如果这个if语句是一个固定的条件检测表达式,也就是说,如果if语句的条件不会受循环结构的影响,那么不妨采用如下的结构来设计:
  10. if(a == true){ //条件判断
  11. for(var b=1;b<10;b++){
  12. //循环结构
  13. }
  14. }
  15. 但是,如果这个if条件表达式受循环结构的制约,就不能够采用这种结构嵌套了。

建议33

(第一章)改善JavaScript,编写高质量代码。的更多相关文章

  1. 编写高质量代码:改善Java程序的151个建议(第一章:JAVA开发中通用的方法和准则)

    编写高质量代码:改善Java程序的151个建议(第一章:JAVA开发中通用的方法和准则) 目录 建议1: 不要在常量和变量中出现易混淆的字母 建议2: 莫让常量蜕变成变量 建议3: 三元操作符的类型务 ...

  2. 编写高质量代码:改善Java程序的151个建议(第二章:基本类型)

    编写高质量代码:改善Java程序的151个建议(第二章:基本类型) 目录 建议21:用偶判断,不用奇判断 建议22:用整数类型处理货币 建议23:不要让类型默默转换 建议24:边界还是边界 建议25: ...

  3. 编写高质量代码改善C#程序的157个建议——建议157:从写第一个界面开始,就进行自动化测试

    建议157:从写第一个界面开始,就进行自动化测试 如果说单元测试是白盒测试,那么自动化测试就是黑盒测试.黑盒测试要求捕捉界面上的控件句柄,并对其进行编码,以达到模拟人工操作的目的.具体的自动化测试请学 ...

  4. 编写高质量代码改善python程序91个建议学习01

    编写高质量代码改善python程序91个建议学习 第一章 建议1:理解pythonic的相关概念 狭隘的理解:它是高级动态的脚本编程语言,拥有很多强大的库,是解释从上往下执行的 特点: 美胜丑,显胜隐 ...

  5. 编写高质量代码改善C#程序的157个建议——建议4: TryParse比Parse好

    建议4: TryParse比Parse好 如果注意观察除string外的所有基元类型,会发现它们都有两个将字符串转型为本身的方法:Parse和TryParse.以类型double为例,这两个方法最简单 ...

  6. 编写高质量代码改善C#程序的157个建议——导航开篇

    前言 由于最近工作重心的转移,原来和几个同事一起开发的项目也已经上线了,而新项目就是在现有的项目基础上进行优化延伸扩展.打个比方,现在已经上线的项目行政案件的Web管理网站(代码还没那么多相比较即将要 ...

  7. 编写高质量代码--改善python程序的建议(八)

    原文发表在我的博客主页,转载请注明出处! 建议四十一:一般情况下使用ElementTree解析XML python中解析XML文件最广为人知的两个模块是xml.dom.minidom和xml.sax, ...

  8. 编写高质量代码改善java程序的151个建议——导航开篇

    2014-05-16 09:08 by Jeff Li 前言 系列文章:[传送门] 下个星期度过这几天的奋战,会抓紧java的进阶学习.听过一句话,大哥说过,你一个月前的代码去看下,慘不忍睹是吧.确实 ...

  9. 编写高质量代码改善C#程序的157个建议[1-3]

    原文:编写高质量代码改善C#程序的157个建议[1-3] 前言 本文主要来学习记录前三个建议. 建议1.正确操作字符串 建议2.使用默认转型方法 建议3.区别对待强制转换与as和is 其中有很多需要理 ...

随机推荐

  1. HDU 2824 The Euler function --------欧拉模板

    The Euler function Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Other ...

  2. 悟空模式-java-抽象工厂模式

    [一朝,王母娘娘设宴,大开宝阁,瑶池中做蟠桃胜会] 有一天,王母娘娘要在瑶池办party,就需要准备大量的食材.要知道,天上的神仙也分三六九等,九曜星.五方将.二十八宿.四大天王.十二元辰.五方五老. ...

  3. Mybatis源代码分析之parsing包

    parsing,从字面上理解就是编译解析的意思,那么这个包中的内容就应该和mybatis配置文件的编译解析有关系.本文首先会按照引用层次来分别介绍这个包中各个类的作用,而后再用实际的例子解释它们是如何 ...

  4. JAVA中的泛型(Generic)

    Java泛型(Generic)简介 泛型是jdk1.5版本以后推出来的,表示类型参数化,让java能更具有动态性一些,让类型能变成参数传递. 要我自己感觉的话,泛型本身没啥用,跟反射在一起用,就体现出 ...

  5. Code Signal_练习题_Sort by Height

    Some people are standing in a row in a park. There are trees between them which cannot be moved. You ...

  6. Django之WSGI浅谈

    一.什么是Web框架 框架,即framework,特指为解决一个开放性问题而设计的具有一定约束性的支撑结构,使用框架可以帮你快速开发特定的系统. 浏览器与服务器之间发起HTTP请求: 1.浏览器发送一 ...

  7. Integer和new Integer

    Java code   ? 1 2 3 4 5 6 7 8 9 10 public static void main(String[] args) {     Integer i1=10;     I ...

  8. react组件(react-grid-gallery)

    react有很多好玩的组件,react-grid-gallery就是其中一个,主要处理图片展示,对图片进行放大与缩小 文档:https://www.npmjs.com/package/react-gr ...

  9. p2p状态码

    因为需要的确定状态太多,减少数据库的压力,采取二进制表示状态码 状态码工具类 package com.xmg.p2p.base.util; /** * 用户状态类,记录用户在平台使用系统中所有的状态. ...

  10. VC++ 共享内存读写操作

    此解决方案含两个工程文件,一个是写操作工程文件,即把任意字符串写入创建的共享内存里,另外一个读操作工程文件,则是读取共享内存里的数据,从而实现了进程之间的共享内存读写操作. 源码下载