javascript 编程技巧

1.巧用判断：

  在js中，NaN,undefined,Null,0,"" 在转换为bool的时候，是false，因此，能够这样写。

 

if(!obj)  {}

表示一个对象若是为false的时候所作的事情，由于若是obj为以上任何一个，那么就是false，!false便是true，这样，就不须要 if(obj==null || obj == NaN ....)。

2.巧用运算符:

   有一个很经典的技巧，获得时间戳。

var dataspan = new Date()*1;

咱们知道，js是弱类型语言，Date()会返回一个表示时间的字符串，用这个字符串进行算术运算，将获得转换，也就是结果的时间戳。

3.巧用正则表达式：

/.a/ig.exec('xsas')

//至关于建立一个reg对象，调用了exec方法，固然也能调用其余的方法，如：test()等。

4.取数组最大值和最小值：

 

var values = [1,2,3,40,23]; 
var max = Math.max.apply(Math,values);

调用Max.apply,设置对象的为Math，而后传递一个Values，就能肯定最大值。

5.内存优化：

function p(){this.p='moersing'}; var p1 = new p();  

   p1.xx 

   p1.xx

   .......

   p1=null;  //执行完操做以后，最后手动解除对p1的引用。

6.最受欢迎的建立对象方式（原型模式）：

function c(){

    this.name ='moersing';

    this.age=18;

    this.books=['javascript develop','C# develop'];

  }

  c.prototype={ 
       displayBookName:function (){ 
        foreach(var t in this.books) 
        {
           document.write(this.books[t]);
        }
    }
}

原型构造模式的最大缺点在于引用类型的共享，因此，将引用类型定义在构造函数中，而将通用方法定义在原型中，使用this引用。

7.块级做用域和私有变量

    在javascript中,没有块级做用域和私有变量这一说，可是，利用一些特性，则能模仿这些效果。

7.1块级做用域：

(function(){ 

      //块级做用域

}
)();

    匿名函数外面加上一个括号，我管它叫"函数标准化",也就是说，能够像标准函数那样调用，如：

 var name =function(){};
(name)();//通常不会这么写;</P>

这么作的好处就是，在()外部没法访问到函数中变量，也就成了块级做用域，这种方式通常用在编写插件的时候，不会再全局 (global)中添加额外的变量，并且，在函数执行完毕以后，其内部定义的变量就被销毁了，因此，也不会有闭包特性存在的问题。

7.2私有变量：

function private()
 { 
   var name = 'moersing';
   this.getName = function(){
   return this.name;

   }
}

私有变量实际上就是利用函数的做用域做为限制(外部没法访问),而后定义一个方法，这个方法返回相应的变量，仅此而已。

8.DOM之NodeList：

   nodeList是一个动态的元素,这意味着，在文档中添加任何元素，nodeList都会实时更新，如：

var alldiv = document.getElementsByTagName('div');

    for(var i=0;i<alldiv.length;i++)
    {
        var div = document.createElement('div');

        div.innerHTML= i.toString();

        document.body.appendChild(div);
    }

这段代码会形成无限循环，在循环里面建立了一个div，而后appendChild方法将其添加到body中，那么，全部alldiv会当即就更新，因此，i<alldiv.length永远没法成立，要解决这个问题，能够使用下面方式：

var alldiv = document.getElementsByTagName('div');

    var len,i;

    for(i=0,len=alldiv.length;i<len;i++)
    {
        var div = document.createElement('div');

        div.innerHTML= i.toString();

        document.body.appendChild(div);

    }

这里建议：最好不要频繁的对NodeList操做，由于每次操做都会执行一次DOM树的查询。

  除了以上介绍的方法外，HTML5 新加入的API(selector API Level1)也能解决这个问题，它相似C#的linq及时查询，至于什么是linq及时查询，之后我会更新blog，敬请关注： 

var allDiv= document.querySelectorAll('div');

    for(var i=0;i<alldiv.length;i++)
    {
        var div = document.createElement('div');

        div.innerHTML= i.toString();

        document.body.appendChild(div);

    }

   querySelectorAll须要一个参数，一个CSS选择器，相似jquery中的$(),它返回的NodeList是一个及时的，非动态的DOM集合。

   另外还有一个querySelector，返回匹配的第一个元素，有关HTML5 API 详 见

http://www.w3.org/standards/techs/dom#w3c_all 

或者

 https://developer.mozilla.org/zh-CN/docs/Web/API

另外，本人也在酝酿一篇blog，专门讲HTML5 API的，敬请关注。

9.DOM性能：

    不要作这种傻事(我作过。。。)

for(var i=0;i<10;i++)
    { 
       document.querySelector('ul').innerHTML="<li>"+i+"</li>";
    }

给对象的innerHTML赋值，会调用内置的C++解析器解析这个字符串，虽然速度很快，可是最好不要这样操做，会有必定的性能流失。

最好这样作：

var ih=null;

for(var i=0;i<10;i++)
 { 
    ih+="<li>"+i+"</li>";
 }

  document.querySelector('ul').innerHTML=ih;

另外的一些性能优化话题，等有时间再更新。