生活随笔
收集整理的這篇文章主要介紹了
当javaScript从入门到提高前需要注意的细节:变量部分
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
到了HTML5的時代,對javaScript的要求不是降低了,而是更提高了。javaScript語言的入門非常簡單,如果你有java、C#等C風格的結構化語言的基礎,那javaScript你最多半天就可以寫點什么了。但是javaScript是一種動態語言,這個特性決定了他在很多方面和java、C#等語言有極大的不同。很多人說只要會java、C#就可以在短時間內搞定javaScript,估計一般都是吹牛來的,用javaScript寫點簡單的應用沒有問題,如果要完全比較好的掌握,那需要真正的理解javaScript的動態這個特性。
當你快速的了解的javaScript入門編程后,在提高開發能力之前,需要的是確保掌握javaScript的編程細節或者說特殊性。
而且和css在不同的瀏覽器中有兼容性問題一樣,javaScript在不同的瀏覽器和版本中也同樣有不同的變化。
我認為javaScript入門之后,向中級(基于面向對象的編程)發展之前,有兩個問題會對開發者有影響:類型的動態和語法的靈活性。而這兩點的集合,是另很多入門級的javaScript人員造成各種詭異問題的核心。我這篇文章不討論關于語法的基礎,關于核心對象的方法,也不關心dom的處理,這些內容在網上的任何javaScript教程中都有,我們討論一個些基于代碼級別但容易寫錯的地方,為你將來的高質量的javaScript奠定些好的基礎。
我以下的內容是在IE7/8、Chrome14、FireFox10下進行測試。同時聲明一個事情,下面的內容的次序比較隨意,比javaScript還隨意,不是作為一步步的教程給零基礎看的。需要你至少有些javaScript的代碼經驗了。
?
關于變量部分
在javaScript中變量使用var聲明的變量是當前作用域的變量,不使用var聲明的則肯定是全局變量。
<script?type="text/javascript"> ?? ????var?x?=?10;?? ????y?=?100;?? ? ????function?fun1()?{ ? ????????var?m?=?99;?? ????????n?=?9;?? ????} ?? ????alert(typeof?this.x);?? ????alert(typeof?this.y);?? ????alert(typeof?this.m);?? ????alert(typeof?this.n);?? ????fun1(); ? ????alert(typeof?this.m);?? ????alert(typeof?this.n);?? ???? ??</script>?以上代碼說明,當fun1被執行后,函數內沒有用var聲明的n變量,被注冊為全局變量了。
下面的代碼得到同樣的執行效果
<script?type="text/javascript"> ?? ????var?x?=?10;?? ????y?=?100;?? ? ????function?fun1()?{ ? ????????var?m?=?99;?? ????????n?=?9;?? ????} ?? ????alert(typeof?window.x);?? ????alert(typeof?window.y);?? ????alert(typeof?window.m);?? ????alert(typeof?window.n);?? ????fun1(); ? ????alert(typeof?window.m);?? ????alert(typeof?window.n);?? ???? ??</script>?那么,我們可以明顯的得到一個推理,在全局里面,window和this是同一個對象指向。
<script?type="text/javascript"> ? ????alert(this?==?window); ? ????alert(this?===?window); ? </script>?那么下面的函數在其函數狀態和對象狀態時this的指向是不同的,因為javaScript的動態的執行,當其執行到的時候,才去計算上下文情況。
<script?type="text/javascript"> ?? ????function?Fo1()?{ ? ????????return?this; ? ????} ??????alert(Fo1()); ? ????alert(new?Fo1()); ? ???? ?</script>?同樣作為變量,使用var聲明的變量是不可以刪除的,沒有使用var聲明的變量是可以刪除的
var?x?=?10;?? y?=?100;?? ? function?fun1()?{ ? ????var?m?=?99;?? ????n?=?9;?? ????delete?m; ? ????delete?n; ? ????alert(typeof?m);?? ????alert(typeof?n);?? } ?? delete?x; ? delete?y; ? ? alert(typeof?x);?? alert(typeof?y);?? fun1(); ? alert(typeof?n);?? 在javaScript中聲明變量非常的靈活,但這個靈活性,對控制全局和局部要有所注意。
function?fun1()?{ ? ????var?m?=?n?=?10;?? ????var?x,?y?=?1,?k?=?10;?? }?而且,有意思的是,在通常的語言中,我們對變量總是先定義后使用,不過在javaScript中嘛……看以下代碼
function?fun1()?{ ? ????alert(typeof?x);?? ????alert(typeof?y);?? ????var?x?=?10; ? ????alert(typeof?x);?? } ??fun1();?這樣的結果,對你來說是完全可以接受和預期的,不過……
function?fun1()?{ ? ????alert(x);?? ????alert(y);?? ????var?x?=?10; ? ????alert(x);?? } ??fun1();?上面的現象很奇怪,如果我們當真要用x和y的時候,編譯器卻給予不同的對待,認為x僅僅是沒有定義(認可已經聲明了),而y是真正的不存在。這說明在處理一個范圍的變量的時候,var無論你在哪里聲明的,總是一開始就進行分配了。對于非var定義的變量嘛,就沒有這樣的待遇了,必須等執行到才進行分配
<pre?name="code"?class="html">function?fun1()?{ ? ????alert(x);?? ????alert(y);?? ????x?=?10; ? ????alert(x);?? } ?fun1();?更需要注意的是,在函數內部聲明的var變量,并不局限在聲明的代碼語句塊中,看看以下代碼
function?fun1()?{ ? ????for?(var?i?=?0;?i?<?10;?i++)?{ ? ?????} ? ????alert(i);?? } ??fun1();?所以呢,我們推薦在一個對象/函數的第一行就把所有的局部變量全部聲明完畢
function?fun1()?{ ? ????var?value?=?1, ? ????arr?=?[], ??????obj?=?{}, ? ????date?=?new?Date(), ? ????has?=?false; ? }?注意變量之間用逗號隔離,這樣的好處是明顯的,自己去考慮吧。
javaScript的語法很靈活,語句后面可以不加;來表示結束,這個時候編譯器會講硬回車作為語句的結束符合
function?fun1()?{ ? ????var?x?=?10 ? ????var?y?=?9 ? ????return?x?+?y ? } ?? alert(fun1());?? 以上的代碼寫法我不知道有什么特別的好處,如果是炫耀你知道可以不用;來結束語句,那就到此為止吧。因為下面的代碼會得到一個錯誤
function?fun1()?{ ? ????return? ? ????{ ? ????????Title:?"title", ? ????????Style:?"style", ? ????????Value:?"Value"? ????} ?} ?? alert(typeof?fun1());?? 因為javaScript會再return后面加一個;
?
?
正確的做法是
function?fun1()?{ ? ????return?{ ? ????????Title:?"title", ? ????????Style:?"style", ? ????????Value:?"Value"? ????}; ?} ?? alert(typeof?fun1());?? 我不好說,這個原因一定是;不寫引起的,但我想說明的是,你要小心javaScript對隨意代碼的隨意處理:你總是應該讓javaScript編譯器知道你明確的要干嘛,而不是由他去猜呀猜的。
本文轉自shyleoking 51CTO博客,原文鏈接:http://blog.51cto.com/shyleoking/803091
總結
以上是生活随笔為你收集整理的当javaScript从入门到提高前需要注意的细节:变量部分的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。