JavaScript進階程式設計(第3版)學習筆記2 js基礎文法

來源:互聯網
上載者:User

這一篇複習一下ECMAScript規範中的基礎文法,英文好的朋友可以直接閱讀官方文檔。JavaScript本質上也是一種類C語言,熟悉C語言的朋友,可以非常輕鬆的閱讀這篇文章,甚至都可以跳過,不過建議你最好還是看一看,在介紹的同時,我可能會引用一些自認為不易理解且比較流行的用法。

基礎文法

1、標識符:所謂標識符,實際上就是指一個滿足一定規範,能夠被引擎識別的名字,可以用來表示常量、變數、函數名、函數參數、對象、對象屬性等所有可命名物件的名稱。

(1)區分大小寫。

(2)以字母、底線(_)或貨幣符號($)開頭,其它字元可以為字母、底線、貨幣符號或數字。這裡的字母包含擴充的ASCII或Unicode字元。

(3)標識符不能是關鍵字、保留字、true、false、null。(有些瀏覽器允許使用undefined,有些不能)。

(4)如果對象屬性含有空格或其它特殊字元,可以用括弧括起來作為一個整體。

2、關鍵字:在語言本身中有特定用途。

    break  case  catch  continue  debugger(ES5中新增)  default  delete  do  else  finally  for  function  if  in  instanceof  new  return  switch  this  throw  try  typeof  var  void  while  with

3、保留字:被語言本身保留,將來可能作為關鍵字。

  ES3中的保留字:

    abstract  boolean  byte  char  class  const  debugger  double  enum  export  extends  final  float  goto  implements  import  int  interface  long  native  package  private  protected  public  short  static  super  synchronized  throws  transient  volatile

  ES5中的非strict 模式下的保留字:

    class  const  enum  export  extends  import  super

  ES5的strict 模式下的保留字:

    implements  interface  let(ES5中新增)  package  private  protected  public  static  yield(ES5中新增)

4、strict 模式:在ES5中引入strict 模式,通過使用"use strict"來開啟strict 模式,可以在頂部開啟全域strict 模式,也可以在函數範圍範圍內開啟局部strict 模式。

複製代碼 代碼如下:"use strict"//開啟全域strict 模式,在ES3中,不會有任何影響function fn(){
  "use strict"//開啟局部strict 模式
}

5、注釋:在ECMAScript中,支援兩種格式的注釋,單行注釋和塊級注釋: 複製代碼 代碼如下:// 單行注釋,以兩個斜杠//開頭/*
* 多行(塊級)注釋,以一個斜杠/和一個星號*開頭,一個星號和一個斜杠結尾,這裡中間行的星號*不是必須的
*/

說明:隨著JS代碼越來越複雜,注釋也變的越來越重要,而文檔自動化也顯得愈加重要,目前已經有很多開源JS庫用於自動化產生類似於Javadoc的JS文檔,比如JSDoc、YUIDoc等,這個時候,對注釋也會有相應的格式要求,有興趣的朋友可以找相關資料研究。

6、變數:變數在其本質上不過是記憶體空間在語言層級的外在抽象。

(1)動態類型:在ECMAScript中,變數是動態類型的,你可以在定義的時候初始化為一個Number類型,緊接著,你可以把一個字串值賦給它: 複製代碼 代碼如下:var age = 29;
age = 'twenty-nine';  //雖然有這種靈活性,但我建議你除非明確知道自己在做什麼,否則別這樣做。

(2)var操作符:變數使用var來聲明,對於未初始化的變數,會預設為undefined,也可以直接使用變數而不聲明(在我看來,這同樣是一個沒有存在理由的特性),它們之間最重要的區別就是使用var聲明時,聲明的變數只在當前範圍有效,而不使用var時,變數就會定義在全域範圍。可以通過下面的例子來體會其中的區別: 複製代碼 代碼如下:var name = 'linjisong'; //定義全域變數並賦值
age = 29; //直接使用變數,相當於定義全域變數並賦值
//sal; //錯誤
var salary; //定義全域變數,未初始化
//這裡只是函式宣告,沒有實際調用,所以內部定義的變數不會生效
function fn(){
var name = 'oulinhai';//定義局部變數並賦值
age = 23; //給全域變數賦值
work = 'it';      //沒有使用var,即便是在函數局部的變數,也會成為全域變數
}
//函數實際調用前
console.info(salary);   //undefined
console.info(name);   // linjisong
console.info(age); // 29
try{
console.info(work);//由於在全域環境中沒有定義work,這裡會拋出異常
}catch(e){}
fn();//實際調用,代碼中對於變數的變更會顯現出來
console.info(name); // linjisong,由於函數內部使用了var,所以不會更改全域的name值
console.info(age); // 23
console.info(work); // it

(3)聲明提升:這個問題在講函式宣告和函數運算式時還會再次談到,這裡先提一下,看代碼: 複製代碼 代碼如下:console.info(name);//undefined
console.info(getName);//getName()函數
console.info(getName());//undefined
try{
console.info(age);//異常
}catch(e){
console.info(e);//ReferenceError
}
console.info(getAge);//undefined
try{
console.info(getAge());//異常
}catch(e){
console.info(e);//TypeError
}
var name = 'linjisong';//變數聲明,提升
age = 29;//直接使用全域變數,不提升
function getName(){//函式宣告,提升
return name;
}
var getAge = function(){//變數getAge的聲明,提升;擷取年齡的匿名函數運算式,不提升
return age;
}
console.info(name);//linjisong
console.info(getName);//getName()函數
console.info(getName());//linjisong
console.info(age);//29
console.info(getAge);//擷取年齡的匿名函數
console.info(getAge());//29

你有沒有自己推斷出上面的輸出結果?如果已經推斷出,可以跳過了,如果還存有疑問,那麼先看看下面關於聲明提升的描述,然後再回過頭來印證上面的輸出結果:
    A、引擎在解析時,首先會解析函式宣告,然後解析變數聲明(解析時不會覆蓋類型),最後再執行代碼;
    B、解析函式宣告時,會同時解析類型(函數),但不會執行,解析變數聲明時,只解析變數,不會初始化。
  這裡涉及的只是全域範圍,在函數範圍中還有函數參數也和聲明提升有關,在後面講述函數時再討論。
  上面的代碼,首先會把第18行的函式宣告和第16、21行的變數聲明提升到最開始解析,然後再執行。因此第1、9行因為變數聲明提升但尚未初始化,所以輸出undefined,從而第11行因為無法確定是函數類型而拋出類型異常;第2、3行因為函式宣告提升並且解析函數類型,所以第2行輸出函數,第3行可以調用函數,但傳回值未初始化而輸出undefined;第5行因為尚未聲明變數,會拋出引用異常。
(4)可以使用一條語句定義多個變數,用逗號分開即可。如: 複製代碼 代碼如下:var name='linjisong',
age=29,
work='it';

(5)在ES5的strict 模式下,不能定義名為eval或arguments的變數。
7、語句
(1)語句:以一個分號“;”結尾,如果省略分號,由解析器確定語句的結尾。
  對於JS中語句可以省略分號的特性,我想不到任何存在的理由,強烈建議每條語句均使用分號來明確結束,不要讓解析器花費時間來“猜測”你的程式,而且,更加重要的是,在很多壓縮公用程式中,猜測並不能保證百分百的正確。
(2)代碼塊:以左花括弧({)開始,右花括弧(})結束。
  在JS中雖然有代碼塊的概念,但是卻沒有相應的塊級範圍,這是和一般類C語言所不同的。對於控制語句(比如if),不要因為只有一條語句就不使用代碼塊,這會給維護你程式的夥計種下犯錯的種子。 複製代碼 代碼如下:for(var i=0; i<10; i++)
{
}
console.info(i);//輸出10,在代碼塊之後仍可以訪問i,說明JS無塊級範圍
if(i < 10)
//console.info(i); 不使用代碼塊,在維護時(比如添加1條語句)容易犯錯
{
console.info(i);
}

 花括弧({})除了作為代碼塊來使用外,還有一個很重要的用處就是定義對象字面量,這在後面還會再有論述。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.