亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

分享9點個人認為比較重要的javascript 編程技巧

 更新時間:2015年04月27日 09:27:03   投稿:hebedich  
接觸和學習javascript也有3~4年了,真正牽扯到前后臺數(shù)據(jù)的交互,數(shù)據(jù)算法等高級編程知之甚少,甚至很少用,如果你問我你知道js什么知識呢?我可能只能說知道點jQuery的技巧,說編程都談不上,所以需要把某一些技巧作為編程習慣固定下來,免于以后有人問我你知道什么?

1.巧用判斷:

  在js中,NaN,undefined,Null,0,"" 在轉(zhuǎn)換為bool的時候,是false,所以,可以這樣寫。

復(fù)制代碼 代碼如下:

if(!obj)  {}

表示一個對象如果為false的時候所做的事情,因為如果obj為以上任何一個,那么就是false,!false即是true,這樣,就不需要 if(obj==null || obj == NaN ....)。

2.巧用運算符:

   有一個很經(jīng)典的技巧,得到時間戳。

復(fù)制代碼 代碼如下:

var dataspan = new Date()*1;

我們知道,js是弱類型語言,Date()會返回一個表示時間的字符串,用這個字符串進行算術(shù)運算,將得到轉(zhuǎn)換,也就是結(jié)果的時間戳。

3.巧用正則表達式:

復(fù)制代碼 代碼如下:

/.a/ig.exec('xsas')
//相當于創(chuàng)建一個reg對象,調(diào)用了exec方法,當然也能調(diào)用其他的方法,如:test(),match()等。

4.取數(shù)組最大值和最小值:

復(fù)制代碼 代碼如下:

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

調(diào)用Max.apply,設(shè)置對象的為Math,然后傳遞一個Values,就能確定最大值。

5.內(nèi)存優(yōu)化:

復(fù)制代碼 代碼如下:

function p(){this.p='moersing'}; var p1 = new p(); 
   p1.xx
   p1.xx
   .......
   p1=null;  //執(zhí)行完操作之后,最后手動解除對p1的引用。

6.最受歡迎的創(chuàng)建對象方式(原型模式):

復(fù)制代碼 代碼如下:

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]);
        }
    }
}

原型構(gòu)造模式的最大缺點在于引用類型的共享,所以,將引用類型定義在構(gòu)造函數(shù)中,而將通用方法定義在原型中,使用this引用。

7.塊級作用域和私有變量

    在javascript中,沒有塊級作用域和私有變量這一說,但是,利用一些特性,則能模仿這些效果。

7.1塊級作用域:

復(fù)制代碼 代碼如下:

(function(){
      //塊級作用域
}
)();

    匿名函數(shù)外面加上一個括號,我管它叫"函數(shù)標準化",也就是說,可以像標準函數(shù)那樣調(diào)用,如:

復(fù)制代碼 代碼如下:

 var name =function(){};
(name)();//一般不會這么寫;

這么做的好處就是,在()外部無法訪問到函數(shù)中變量,也就成了塊級作用域,這種方式一般用在編寫插件的時候,不會再全局 (global)中添加額外的變量,而且,在函數(shù)執(zhí)行完畢之后,其內(nèi)部定義的變量就被銷毀了,所以,也不會有閉包特性存在的問題。

7.2私有變量:

復(fù)制代碼 代碼如下:

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

私有變量實際上就是利用函數(shù)的作用域作為限制(外部無法訪問),然后定義一個方法,這個方法返回相應(yīng)的變量,僅此而已。

8.DOM之NodeList:

   nodeList是一個動態(tài)的元素,這意味著,在文檔中添加任何元素,nodeList都會實時更新,如:

復(fù)制代碼 代碼如下:

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);
    }

這段代碼會造成無限循環(huán),在循環(huán)里面創(chuàng)建了一個div,然后appendChild方法將其添加到body中,那么,所有alldiv會立即就更新,所以,i<alldiv.length永遠無法成立,要解決這個問題,可以使用下面方式:

復(fù)制代碼 代碼如下:

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操作,因為每次操作都會執(zhí)行一次DOM樹的查詢。

  除了以上介紹的方法外,HTML5 新加入的API(selector API Level1)也能解決這個問題,它類似C#的linq及時查詢,至于什么是linq及時查詢,以后我會更新blog,敬請關(guān)注:

復(fù)制代碼 代碼如下:

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需要一個參數(shù),一個CSS選擇器,類似jquery中的$(),它返回的NodeList是一個及時的,非動態(tài)的DOM集合。

   另外還有一個querySelector,返回匹配的第一個元素,有關(guān)HTML5 API 詳 見

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

或者

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

另外,本人也在醞釀一篇blog,專門講HTML5 API的,敬請關(guān)注。

9.DOM性能:

    不要做這種傻事(我做過。。。)

復(fù)制代碼 代碼如下:

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

給對象的innerHTML賦值,會調(diào)用內(nèi)置的C++解析器解析這個字符串,雖然速度很快,但是最好不要這樣操作,會有一定的性能流失。

最好這樣做:

復(fù)制代碼 代碼如下:

var ih=null;

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

另外的一些性能優(yōu)化話題,等有時間再更新。

以上所述就是本文的全部內(nèi)容了,希望大家能夠喜歡。

相關(guān)文章

最新評論