DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> TypeScript 學習筆記之基本類型
TypeScript 學習筆記之基本類型
編輯:JavaScript綜合知識     

   TypeScript 是 JavaScript 的超集,TypeScript 經過編譯之後都會生成 JavaScript 代碼。TypeScript 最大的特點就是類型化,因此才叫做 TypeScript。比起弱類型的 JavaScript,類型化的 TypeScript 顯得更加容易維護。

  在 TypeScript 中一共有 7 種基本類型。

  1、boolean

  代碼如下:

  var isDone: boolean = false;

  2、number

  代表 JavaScript 中的數字。在 JavaScript 中,無論是“整數”還是“浮點數”,都是以雙精度浮點類型存儲的。

   代碼如下:

  var height: number = 6;

  3、string

  代表字符串。跟 JavaScript 一樣,可以使用一對雙引號(")或一對單引號(')來表示字符串。

  代碼如下:

  var name: string = "bob";

  name = 'smith';

  4、array

  TypeScript 中有兩種數組聲明方法。

  ①使用“[]”來聲明:

   代碼如下:

  var list: number[] = [1, 2, 3];

  ②使用數組類型來聲明:

  代碼如下:

  var list: Array = [1, 2, 3];

  兩種聲明方式都可以使用,效果並不會有區別。但建議代碼中應盡量只使用其中一種,以保持代碼風格統一。

  5、enum

  枚舉類型是 TypeScript 中新添加的,而 JavaScript 中是沒有這個類型的。

  代碼如下:

  enum Color {

  Red,

  Green,

  Blue

  };

  var c: Color = Color.Green;

  跟 C# 一樣,如果不聲明第一項的值,那麼上面 Red 的值就是 0,然後每一項都增加一,即 Green 是 1,Blue 是 2。

  代碼如下:

  enum Color {

  Red = 1,

  Green,

  Blue

  };

  var c: Color = Color.Green;

  所以此時 Red 的值為 1,Green 為 2,Blue 為 3。

  當然也可以為每一項都指定一個值。

  代碼如下:

  enum Color {

  Red = 1,

  Green = 2,

  Blue = 4

  };

  var c: Color = Color.Green;

  另外枚舉類型還有一個比較特殊的功能,假如我們有一個數值,但是我們不知道枚舉類型中是否有定義,可以用以下方式來獲取:

  代碼如下:

  enum Color {

  Red = 1,

  Green,

  Blue

  };

  var colorName: string = Color[2];

  alert(colorName);

  colorName = Color[4];

  alert(colorName);

  那麼將會輸出 Green 和 undefined。因為 Green 的值是 2,而沒有一個枚舉定義的值是 4,所以返回 undefined。

  6、any

  和 JavaScript 中變量的默認類型一樣,指代是動態的,能夠賦予任意類型。例如:

  代碼如下:

  var notSure: any = 4;

  notSure = "maybe a string instead";

  notSure = false; // okay, definitely a boolean

  定義為 any 後,將失去語法感知的功能,就相當於寫 JavaScript 一樣。

  值得一提的是,any 可以配合數組來使用:

  代碼如下:

  var list: any[] = [1, true, "free"];

  list[1] = 100;

  7、void

  這個類型僅能在函數中使用,可以將函數的返回類型指定為 void,表示該函數不返回任何值。

  代碼如下:

  function warnUser(): void {

  alert("This is my warning message");

  }

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

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved