TypeScript 變量命名規(guī)則的實(shí)踐
你想了解 TypeScript 的變量命名規(guī)則,首先需要明確:TypeScript 完全繼承了 JavaScript 的變量命名規(guī)則(語(yǔ)法層面一致),同時(shí)有一套行業(yè)通用的最佳實(shí)踐(風(fēng)格層面),具體分為核心規(guī)則和推薦規(guī)范兩部分:
一、 語(yǔ)法層面:必須遵守的硬性規(guī)則(不可違反)
這些是 TypeScript 編譯器強(qiáng)制執(zhí)行的命名要求,違反會(huì)直接報(bào)錯(cuò):
- 首字符限制:變量名的第一個(gè)字符只能是「字母(a-z/A-Z)」、「下劃線(_)」或「美元符號(hào)($)」,不能以數(shù)字開(kāi)頭(這是最常見(jiàn)的錯(cuò)誤)。
- 合法示例:name、_age、$price、UserInfo
- 非法示例:123num(以數(shù)字開(kāi)頭)、#gender(特殊符號(hào)不允許)
- 后續(xù)字符限制:從第二個(gè)字符開(kāi)始,除了字母、下劃線、美元符號(hào)外,還可以包含數(shù)字(0-9),仍不允許使用其他特殊字符(如 @、#、& 等)。
- 合法示例:user2025、_phone138、$orderNo001
- 非法示例:user-name(包含連字符)、my&address(包含&符號(hào))
- 大小寫敏感:TypeScript 對(duì)變量名的大小寫嚴(yán)格區(qū)分,不同大小寫視為兩個(gè)完全不同的變量。
- 示例:let name = "張三"; let Name = "李四";(這是兩個(gè)獨(dú)立變量,不會(huì)沖突)
- 禁止使用關(guān)鍵字/保留字:不能使用 TypeScript/JavaScript 的內(nèi)置關(guān)鍵字(用于語(yǔ)法功能的單詞)和未來(lái)保留字作為變量名。
- 關(guān)鍵字示例(禁止使用):let、const、var、if、else、function、class、interface、type 等
- 保留字示例(禁止使用):await、enum、export、import、package 等
二、 風(fēng)格層面:行業(yè)通用最佳實(shí)踐(推薦遵守)
這些規(guī)則非語(yǔ)法強(qiáng)制要求,但能提升代碼可讀性、可維護(hù)性,是團(tuán)隊(duì)協(xié)作和開(kāi)源項(xiàng)目的通用規(guī)范:
1. 普通變量/函數(shù)/對(duì)象屬性:小駝峰命名法(camelCase)
這是最基礎(chǔ)的命名風(fēng)格,規(guī)則是「首字母小寫,后續(xù)每個(gè)單詞的首字母大寫」。
- 示例:
// 普通變量 let userName: string = "張三"; let userAge: number = 25; let isStudent: boolean = true; let userAddressList: string[] = ["北京", "上海", "廣州"]; // 函數(shù) function getUserInfo(id: number): object { return { id, userName: "張三", age: 25 }; } // 對(duì)象屬性 const user = { userPhone: "13800138000", userEmail: "zhangsan@example.com" };
2. 類/接口/類型別名:大駝峰命名法(PascalCase)
規(guī)則是「每個(gè)單詞的首字母都大寫」,用于區(qū)分自定義構(gòu)造類型和普通變量。
- 示例:
// 類 class User { name: string; age: number; constructor(name: string, age: number) { this.name = name; this.age = age; } } // 接口 interface UserInfo { id: number; userName: string; address: string; } // 類型別名 type OrderStatus = "pending" | "paid" | "shipped" | "completed"; type NumberOrString = number | string;
3. 常量:全大寫+下劃線分隔(UPPER_SNAKE_CASE)
僅適用于「值不可修改的常量」(通常用 const 聲明,或枚舉常量),用于強(qiáng)調(diào)其不可變性。
- 示例:
// 普通常量 const MAX_SIZE: number = 100; const API_BASE_URL: string = "https://api.example.com"; const DEFAULT_USER_NAME: string = "guest"; // 枚舉常量 enum HttpStatus { OK = 200, NOT_FOUND = 404, SERVER_ERROR = 500 }
4. 特殊命名規(guī)范(場(chǎng)景化)
- 私有成員(類內(nèi)部使用):通常以「下劃線開(kāi)頭」(如
_privateData),TypeScript 也支持用private關(guān)鍵字修飾,下劃線是輔助標(biāo)識(shí)。class Person { public name: string; private _idCard: string; // 私有成員,下劃線標(biāo)識(shí) constructor(name: string, idCard: string) { this.name = name; this._idCard = idCard; } public getIdCard(): string { return this._idCard; // 內(nèi)部可訪問(wèn) } } - 全局變量/環(huán)境變量:通常遵循全大寫下劃線風(fēng)格(如
process.env.NODE_ENV)。 - 避免單字符命名(除了通用場(chǎng)景:
i用于循環(huán)索引、x/y用于坐標(biāo)等),盡量使用語(yǔ)義化命名(如userName優(yōu)于n)。
總結(jié)
- 語(yǔ)法硬性規(guī)則:首字符只能是 字母/_/$、不可數(shù)字開(kāi)頭;后續(xù)可加數(shù)字;大小寫敏感;禁用關(guān)鍵字。
- 風(fēng)格推薦規(guī)則:普通變量/函數(shù)用小駝峰;類/接口用大駝峰;常量用全大寫+下劃線;私有成員用下劃線開(kāi)頭。
- 核心原則:命名語(yǔ)義化(見(jiàn)名知意),保持團(tuán)隊(duì)風(fēng)格統(tǒng)一,提升代碼可維護(hù)性。
到此這篇關(guān)于TypeScript 變量命名規(guī)則的實(shí)踐的文章就介紹到這了,更多相關(guān)TypeScript 變量命名規(guī)則內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Bootstrap進(jìn)度條與AJAX后端數(shù)據(jù)傳遞結(jié)合使用實(shí)例詳解
這篇文章主要介紹了Bootstrap進(jìn)度條與AJAX后端數(shù)據(jù)傳遞結(jié)合使用,需要的朋友可以參考下2017-04-04
Layui Form 自定義驗(yàn)證的實(shí)例代碼
今天小編就為大家分享一篇Layui Form 自定義驗(yàn)證的實(shí)例代碼,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
微信小程序?qū)崿F(xiàn)自動(dòng)回復(fù)圖片消息
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)客服消息自動(dòng)回復(fù)圖片消息,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)吧2023-01-01
使用ImageMagick進(jìn)行圖片縮放、合成與裁剪(js+python)
由于需要在服務(wù)器端處理,使用就研究使用imagemagick來(lái)進(jìn)行。同時(shí)準(zhǔn)備封裝了一個(gè)Node.js和Python的方法,主要還是講一下然后使用imagemagick來(lái)對(duì)圖片進(jìn)行縮放、合成后進(jìn)行裁剪吧2013-09-09
javascript設(shè)計(jì)模式--策略模式之輸入驗(yàn)證
策略模式中的策略就是一種算法或者業(yè)務(wù)規(guī)則,將這些策略作為函數(shù)進(jìn)行封裝,并向外提供統(tǒng)一的調(diào)用執(zhí)行,本文給大家介紹javascript設(shè)計(jì)模式--策略模式之輸入驗(yàn)證,需要的朋友參考下2015-11-11
js判斷數(shù)據(jù)類型如判斷是否為數(shù)組是否為字符串等等
js判斷數(shù)據(jù)類型如判斷是否為數(shù)組類型、判斷是否為字符串類型、判斷是否為數(shù)值類型等等,本文有幾個(gè)不錯(cuò)的示例,大家可以學(xué)習(xí)下2014-01-01
jquery將標(biāo)簽元素的高設(shè)為屏幕的百分比
這篇文章主要介紹了js將標(biāo)簽元素的高設(shè)為屏幕的百分比,需要的朋友可以參考下2017-04-04

