TypeScript 之基礎(chǔ)類型

picture

介紹

為了讓程序更有價(jià)值,我們需要能夠處理最簡單的數(shù)據(jù)單元:數(shù)字乃戈、字符串顶别、結(jié)構(gòu)體邮偎、布爾值等。TypeScript支持與JavaScript幾乎相同的數(shù)據(jù)類型膳帕,此外還提供了實(shí)用的枚舉類型方便我們使用。


布爾值

最基本的數(shù)據(jù)類型就是簡單的 true/ false 值,在 JavaScriptTypeScript 里叫做 boolean珊燎。

let isDone: boolean = false;

數(shù)字

JavaScript 一樣,TypeScript 里的所有數(shù)字都是浮點(diǎn)數(shù)遵湖,這些浮點(diǎn)數(shù)的類型是 number悔政。除了支持十進(jìn)制和十六進(jìn)制字面量,TypeScript 還支持 ECMAScript2015 中引入的二進(jìn)制和八進(jìn)制字面量延旧。

let decLiteral: number = 6;
let hexLiteral: number = 0xf00d;
let binaryLiteral: number = 0b1010;
let octalLiteral: number = 0o744;

字符串

Javascript 程序的另一項(xiàng)基本操作是處理網(wǎng)頁或服務(wù)端的文本數(shù)據(jù)谋国。像其他語言里一樣,我們使用 string 表示文本數(shù)據(jù)類型迁沫。和Javascript 一樣芦瘾,可以使用雙引號(")或單引號(')表示字符串捌蚊。

let name: string = 'bob';
name = 'smith';

你還可以使用模版字符串,它可以定義多行文本和內(nèi)嵌表達(dá)式近弟。 這種字符串是被反引號包圍(```````)缅糟,并且以${ expr }這種形式嵌入表達(dá)式。

let name: string = `GENE`;
let age: number = 37;
let sentence: string = `Hello藐吮,My name is ${name}溺拱,I will be ${age + 1} years old next month`;

這與下面定義 sentence 的方式效果相同。

let sentence: string = 'Hello谣辞,My name is' + name + '迫摔,I will be' + (age + 1) + ' years old next month';

數(shù)組

TypeScriptJavaScript 一樣可以操作數(shù)組元素。 有兩種方式可以定義數(shù)組泥从。 第一種句占,可以在元素類型后面接上 [],表示由此類型元素組成的一個數(shù)組:

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

第二種方式是使用數(shù)組泛型躯嫉。

let list: Array<number> = [1, 2, 3];

元組 Tuple

元組類型允許表示一個已知元素?cái)?shù)量和元素類型的數(shù)組纱烘,各元素的類型不必相同。比如你可以定義一對值分別為 stringnumber 類型的元組祈餐。

// Declare a tuple type
let x: [string,  number];
// Initialize x
x = ['hello', 10]; // OK
// Initialize it incorrectly
x = [10, 'hello']; // Error

當(dāng)訪問一個已知索引的元素擂啥,會得到正確的類型:

console.log(x[0].substr(1)); // OK
console.log(x[1].substr(1)); // Error, 'number' does not have 'substr'

當(dāng)訪問一個越界的元素,會使用聯(lián)合類型替代帆阳。

x[3] = 'world'; // OK, 字符串可以賦值給(string | number)類型
console.log(x[5].toString()); // OK, 'string' 和 'number' 都有 totoString

x[6] = true; // Error, 布爾不是(string | number) 類型

聯(lián)合類型是高級主題哺壶,我們會在以后的章節(jié)里同討論它。

枚舉

enum 類型是對 JavaScript 標(biāo)準(zhǔn)數(shù)據(jù)類型的一個補(bǔ)充蜒谤。像 C# 等其他語言一樣山宾,使用枚舉類型可以為一組數(shù)值賦予美好的友好的名字。

enum Color {Red, Green, Blue};
let c: Color = Color.Green;

默認(rèn)情況下鳍徽,從 0 開始為元素編號资锰。 你也可以手動的指定成員的數(shù)值。 例如阶祭,我們將上面的例子改成從 1 開始編號:

enum Color {Red = 1, Green, Blue};
let c: Color = Color.Green;

或者绷杜,全部都采用手動賦值:

enum Color {Red = 1, Green = 2, Blue = 4};
let c: Color = Color.Green;

枚舉類型提供的一個便利是你可以由枚舉的值得到它的名字。例如濒募,我們知道數(shù)值為 2鞭盟,但是不知道它映射到 Color 里的那個名字,我們可以查找相應(yīng)的名字萨咳。

enum Color {Red = 1, Green, Blue};
let colorName: string = Color[2];
console.log(colorName); // 顯示 Green 因?yàn)樯厦娲a里,它的值是2

Any

有時候疫稿,我們想要為那些在編程階段還不清楚類型的變量指定一個類型培他。這些值可能來自于動態(tài)的內(nèi)容鹃两,比如來自用戶輸入的第三方代碼庫。這種情況下舀凛,我們不希望類型檢查器對這些值進(jìn)行檢查而是直接讓它們通過編譯階段的檢查俊扳。那么我們可以使用 any 類型來標(biāo)記這些變量:

let notSure: any = 4;
notSure = 'maybe a string instead';
notSure = false; // okay, definitely a boolean

在對現(xiàn)有代碼進(jìn)行改寫的時候,就像它在其他語言中那樣猛遍,它允許你在編譯時可選擇的包含或移除類型檢查馋记。你可能認(rèn)為 Object 有相似的作用,就像它在其他語言中那樣懊烤。但是 Object 類型的變量只是允許你給它賦任意值梯醒,但是卻不能夠在它上面調(diào)用任意的方法,即便它真有這樣的方法:

let nouSure: any = 4;
notSure.ifItExists(); // okay, ifItExists might exist at runtime
notSure.toFixed(); // okay, toFixed exists (but the compiler does not check)

let prettySure: Object = 4;
prettySure.toFixed(); // Error: Property 'toFixed' doesn't exist on the type 'Object'.

當(dāng)你只知道一部分?jǐn)?shù)據(jù)的類型時腌紧, any 類型也是有用的茸习。比如,你有一個數(shù)組壁肋,它包含了不同的類型的數(shù)據(jù):

let list: any[] = [1, true, 'free'];

list[1] = 100;

Void

某種程度上來說号胚, void 類型像是與 any 類型相反,它表示沒有任何類型浸遗。當(dāng)一個函數(shù)沒有返回值時猫胁,你通常會見到其返回值類型是 void

function warnUser(): void {
  console.log('This is my warning message');
}

聲明一個 void 類型的變量沒有什么大用,因?yàn)槟阒荒苜x予它 undefinednull 跛锌。

let unusable: void = undefined;

Null 和 Undefined

TypeScript 里弃秆, undefinednull 兩者各自有自己的類型分別叫做 undefinednull 。和 void 相似察净,它們的本身的類型用處不是很大:

// 我們可以為這些變量分配的東西不多驾茴!
let u: undefined = undefined;
let n: null = nill;

默認(rèn)情況下 nullundefined 是所有類型的子類型。也就是說你可以把 nullundefined 賦值給 number 類型的變量氢卡。

然而锈至,當(dāng)你指定了一個 --strickNullChecks 標(biāo)記, nullundefined 只能賦值給 void 和它們自個译秦。這能避免很多常見的問題峡捡。也許在某處傳入一個 stringnullundefined ,你可以使用聯(lián)合類型 string | null | undefined 筑悴。再次說明们拙,后面會介紹聯(lián)合類型。

注意:我們鼓勵盡可能的使用 --strickNullChecks 阁吝,但在本介紹手冊中我們假設(shè)這個標(biāo)記是關(guān)閉的砚婆。

Never

never 類型表示的是那些永不存在的值的類型。例如,never 類型是那些總是會拋出異匙岸ⅲ或根本就不會有返回值的函數(shù)表達(dá)式或箭頭函數(shù)表達(dá)式的返回值類型坷虑;變量也可能是 never 類型,當(dāng)它們被永不為真的類型保護(hù)約束時埂奈。

never 類型是任何類型的子類型迄损,也可以賦值給任何類型;然而账磺,沒有類型是 never 的子類型可以賦值給 never 類型(除了 never 本身除外)芹敌。即便 any 也不可以賦值給 never

下面是一些返回 never 類型的函數(shù):

// 返回 never 的函數(shù)必須存在無法達(dá)到的終點(diǎn)垮抗。
function error(message: string): never {
  throw new Error(message);
}

// 推斷的返回值類型為 never
function fail() {
  return error('Something failed');
}

// 返回 never 的函數(shù)必須存在無法達(dá)到的終點(diǎn)氏捞。
function infiniteLoop(): never {
  while (true) {}
}

Object

object 表示非原始類型,也就是除了 number 借宵, string 幌衣, booleansymbol壤玫, nullundefined 之外的類型豁护。

使用 object 類型,就可以更好的表示像 Object.create 這樣的 API 欲间。例如:

declare function create(o: object | null): void;

create({prop: 0}); // OK
create(null); // OK

create(42); // Error
create('string'); // Error
create('false'); // Error
create('undefined'); // Error

類型斷言

有時候你會遇到這樣的情況楚里,你會比 TypeScript 更了解某個值的詳細(xì)信息。通常這會發(fā)生在你清楚的知道一個實(shí)體具有比它有類型更確切的類型猎贴。

通常類型斷言這種方式可以告訴編譯器:'相信我班缎,我知道自己在干什么'。類型斷言好比其他語言里的類型轉(zhuǎn)換她渴,但是不進(jìn)行特殊的類型檢查和重構(gòu)达址。它沒有運(yùn)行時的影響,只是在編譯階段起作用趁耗。 TypeScript 會假設(shè)你沉唠,程序員,已經(jīng)進(jìn)行了必須的檢查苛败。

類型斷言有兩種形式满葛。其一是 "尖括號" <> 語法:

let someValue: any = 'This is a string';

let strLength: number = (<string>someValue).length

另一個為 as 語法:

let someValue: any = 'This is a string';

let strLength: number = (someValue as string).length

兩種形式是等價(jià)的。至于使用哪個大多數(shù)情況下是憑個人喜好罢屈。然而嘀韧,當(dāng)你在 TypeScript 里使用 JSX 時,只有 as 語法斷言是被允許的缠捌。

關(guān)于 let

你可能已經(jīng)注意到了锄贷,我們使用 let 關(guān)鍵字來替代大家所熟悉的 JavaScript 關(guān)鍵字 varlet 關(guān)鍵字是 JavaScript 的一個新概念, TypeScript 實(shí)現(xiàn)了它谊却。很多常見的問題都可以通過使用 let 來解決蹂随,所以盡可能的使用 let 來替代 var 吧。


本文參考來源: TypeScript 基礎(chǔ)類型

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
禁止轉(zhuǎn)載因惭,如需轉(zhuǎn)載請通過簡信或評論聯(lián)系作者。
  • 序言:七十年代末绩衷,一起剝皮案震驚了整個濱河市蹦魔,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌咳燕,老刑警劉巖勿决,帶你破解...
    沈念sama閱讀 216,402評論 6 499
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異招盲,居然都是意外死亡低缩,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,377評論 3 392
  • 文/潘曉璐 我一進(jìn)店門曹货,熙熙樓的掌柜王于貴愁眉苦臉地迎上來咆繁,“玉大人,你說我怎么就攤上這事顶籽⊥姘悖” “怎么了?”我有些...
    開封第一講書人閱讀 162,483評論 0 353
  • 文/不壞的土叔 我叫張陵礼饱,是天一觀的道長坏为。 經(jīng)常有香客問我,道長镊绪,這世上最難降的妖魔是什么匀伏? 我笑而不...
    開封第一講書人閱讀 58,165評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮蝴韭,結(jié)果婚禮上够颠,老公的妹妹穿的比我還像新娘。我一直安慰自己万皿,他們只是感情好摧找,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,176評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著牢硅,像睡著了一般蹬耘。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上减余,一...
    開封第一講書人閱讀 51,146評論 1 297
  • 那天综苔,我揣著相機(jī)與錄音,去河邊找鬼。 笑死如筛,一個胖子當(dāng)著我的面吹牛堡牡,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播杨刨,決...
    沈念sama閱讀 40,032評論 3 417
  • 文/蒼蘭香墨 我猛地睜開眼晤柄,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了妖胀?” 一聲冷哼從身側(cè)響起芥颈,我...
    開封第一講書人閱讀 38,896評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎赚抡,沒想到半個月后爬坑,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,311評論 1 310
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡涂臣,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,536評論 2 332
  • 正文 我和宋清朗相戀三年盾计,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片赁遗。...
    茶點(diǎn)故事閱讀 39,696評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡署辉,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出岩四,到底是詐尸還是另有隱情涨薪,我是刑警寧澤,帶...
    沈念sama閱讀 35,413評論 5 343
  • 正文 年R本政府宣布炫乓,位于F島的核電站刚夺,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏末捣。R本人自食惡果不足惜侠姑,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,008評論 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望箩做。 院中可真熱鬧莽红,春花似錦、人聲如沸邦邦。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,659評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽燃辖。三九已至鬼店,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間黔龟,已是汗流浹背妇智。 一陣腳步聲響...
    開封第一講書人閱讀 32,815評論 1 269
  • 我被黑心中介騙來泰國打工滥玷, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人巍棱。 一個月前我還...
    沈念sama閱讀 47,698評論 2 368
  • 正文 我出身青樓惑畴,卻偏偏與公主長得像,于是被迫代替她去往敵國和親航徙。 傳聞我的和親對象是個殘疾皇子如贷,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,592評論 2 353