TypeScript新特性之using關(guān)鍵字的使用方法
使用場景
假設(shè)我們現(xiàn)在寫了一個打印日志到文件中的函數(shù):
function log(content: string) {
const file = fs.openSync("log.txt", "w+");
file.writeFileSync(file, content);
// 釋放文件
fs.closeSync(file);
}
非常簡單的一個功能,但過了幾天,組長要求我們把日志區(qū)分為普通日志和警告日志,此時我們需要再改造一下這個函數(shù):
function log(content: string, isWarn?: boolean) {
const file = fs.openSync("log.txt", "w+");
file.writeFileSync(file, content);
if (!isWarn) {
return;
}
// isWarn 的日志添加警告標識
file.writeFileSync(file, "[warn]");
// 釋放文件
fs.closeSync(file);
}
這個時候運行函數(shù)會出現(xiàn)問題,因為在 isWarn 為 false 的情況下,我們直接 return 了,沒有走到函數(shù)末尾 fs.closeSync(),這會導(dǎo)致文件連接沒有釋放。
雖然說上面這段代碼的寫法本身就有些問題,但在復(fù)雜的邏輯中確實很容易出現(xiàn)忘記釋放文件、數(shù)據(jù)庫連接這樣的現(xiàn)象,而 using 關(guān)鍵字就能夠很好地解決這類問題。
把上面的例子用 using 改寫如下所示:
function log(content: string, isWarn?: boolean) {
using file = fs.openSync("log.txt", "w+");
file.writeSync(file, content);
if (!isWarn) {
return;
}
// isWarn 的日志添加警告標識
file.writeSync(file, "[warn]");
}
可以看到我們甚至不需要在函數(shù)末尾調(diào)用 fs.closeSync(),這是因為 using 關(guān)鍵字聲明的變量會在被釋放時執(zhí)行一些額外的操作,有點類似于 C++ 中的析構(gòu)函數(shù)。在這個例子中我們 using 的是 node.js 原生的 openSync 函數(shù)返回的變量,它會在變量被刪除時自動釋放文件的連接,這樣我們就不需要自己手動進行管理了,減少了犯錯誤的可能。
使用方法
上面的例子中,我們不需要任何額外操作就獲得了自動釋放文件的能力,這是因為標準庫已經(jīng)幫我們定義好了文件變量被釋放時的行為。如果是我們自己寫的功能,則需要自己對變量釋放時要做的操作進行定義。
假設(shè)我們自己寫了一個打開文件的函數(shù):
function openFile(path) {
console.log("打開文件:", path);
const file = fs.openSync(path, "w+");
return {
handle: file,
[Symbol.dispose]() {
console.log("釋放文件:", path);
fs.closeSync();
},
};
}
返回對象中的 [Symbol.dispose]() 會在變量被回收時調(diào)用(如果變量是用 using 聲明的),這樣我們就不需要讓用戶手動釋放文件了,保證了程序的正確性。
我們來看看使用這個函數(shù)的實例:
using a = openFile("a")
fs.writeSync(file, "hello");
運行該代碼會打?。?/p>
打開文件:a
釋放文件:a
當(dāng)我們調(diào)用 openFile() 創(chuàng)建變量 a 時,我們會打印 打開文件:a 并把文件的描述符返回。當(dāng)程序運行結(jié)束時,變量 a 的生命周期結(jié)束,[Symbol.dispose]() 被調(diào)用,打印 釋放文件:a 并關(guān)閉文件連接。
我們再看一個復(fù)雜點的例子:
using a = openFile("a")
using b = openFile("b")
{
using c = openFile("c")
using d = openFile("d")
}
using e = openFile("e")
大家可以停下來想一想,這段程序會打印出什么樣的內(nèi)容?
答案是:
打開文件:a
打開文件:b
打開文件:c
打開文件:d
釋放文件:d
釋放文件:c
打開文件:e
釋放文件:b
釋放文件:a
可以看到,每個變量在其生命周期結(jié)束時就調(diào)用了它的 [Symbol.dispose]() 函數(shù),因為 c 和 d 被放在塊級作用域中,所以比外層的 a, b 和 e 更快被釋放。
在處理這類需要釋放連接的功能時,最怕的就是中間的某一步代碼停止了整個函數(shù)的運行,比如說中途 throw 了一個錯誤,然后釋放連接的代碼就被跳過了。這種情況下 using 關(guān)鍵字也能夠很好的完成任務(wù)。以下面的代碼為例:
using a = openFile("a")
using b = openFile("b")
{
using c = openFile("c")
throw new Error()
using d = openFile("d")
}
using e = openFile("e")
此時控制臺打印如下:
打開文件:a
打開文件:b
打開文件:c
釋放文件:c
釋放文件:b
釋放文件:a
可以看到拋出錯誤時,已經(jīng)被打開的幾個文件也正確地關(guān)閉了,這就是 using 關(guān)鍵字的功勞。
異步 using
我們剛剛處理文件用的是同步方法,但這并不是最佳實踐,通常我們會使用異步的方法來進行文件的操作。但是 [Symbol.dispose]() 必須是同步的函數(shù),這個時候我們就要用到另外一個 Symbol,它的名字就是……沒錯,[Symbol.asyncDispose]()!
我們用異步的方式改寫一下剛剛的 openFile() 函數(shù):
function openFile(path) {
console.log("打開文件:", path);
const file = fs.openSync(path, "w+");
return {
handle: file,
async [Symbol.asyncDispose]() {
console.log("釋放文件:", path);
await fs.close();
},
};
}
這個時候我們需要改變一下使用 using 關(guān)鍵字的方式,在 using 之前添加 await:
async (() => {
await using a = openFile("a")
await using b = openFile("b")
})()
這里的 await 關(guān)鍵字具有一定的迷惑性,看似是變量聲明語句被 await 了,實際上并沒有。我們加一行 log 試試:
async (() => {
await using a = openFile("a")
console.log("haha")
await using b = openFile("b")
})()
輸出:
打開文件:a
haha
打開文件:b
釋放文件:b
釋放文件:a
可以發(fā)現(xiàn) openFile() 和 console.log() 是同步執(zhí)行的。那么異步的是什么呢?當(dāng)然就是 [Symbol.asyncDispose]() 函數(shù)了,但因為它是在函數(shù)最后隱式執(zhí)行的,所以我們感覺不到。
總結(jié)
using 是一個新的變量聲明關(guān)鍵字,它能夠幫助我們更好地管理需要釋放的資源,減少代碼出錯的概率,是非常實用的一個新特性。目前該特性已經(jīng)得到 TypeScript 新版本的支持,JavaScript 的原生支持也指日可待了。
以上就是TypeScript新特性之using關(guān)鍵字的使用方法的詳細內(nèi)容,更多關(guān)于TypeScript using關(guān)鍵字的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
javascript 學(xué)習(xí)筆記(onchange等)
javascript 學(xué)習(xí)筆記,一些簡單的小技巧,學(xué)習(xí)js的朋友可以看下。2010-11-11
JavaScript中創(chuàng)建對象和繼承示例解讀
這篇文章主要介紹了JavaScript中怎樣創(chuàng)建對象和繼承,需要的朋友可以參考下2014-02-02
JavaScript實現(xiàn)網(wǎng)頁帶動畫返回頂部的方法詳解
這篇文章主要為大家詳細介紹了如何利用JavaScript實現(xiàn)網(wǎng)頁帶動畫返回頂部的效果,文中的示例代碼講解詳細,感興趣的小伙伴可以了解一下2022-08-08
javascript 三種數(shù)組復(fù)制方法的性能對比
javascript 三種數(shù)組復(fù)制方法的性能對比,對于webkit, 使用concat; 其他瀏覽器, 使用slice.2010-01-01
利用html2canvas+jspdf實現(xiàn)頁面導(dǎo)出成pdf功能源碼
jsPDF是一個強大的JavaScript庫,用于在瀏覽器中直接生成PDF文檔,下面這篇文章主要介紹了利用html2canvas+jspdf實現(xiàn)頁面導(dǎo)出成pdf功能的相關(guān)資料,文中給了詳細的代碼示例,需要的朋友可以參考下2026-01-01

