字節(jié)面試題:判斷傳入的函數(shù)是否標記了 async

JavaScript 是一門非常靈活和強大的語言汰现,它擁有許多新穎和有趣的特性逾条,讓我們可以更方便地處理異步操作,編寫更優(yōu)雅和清晰的代碼座柱。

你一定聽說過 async/await、Promise物舒、Generator 等等色洞。

但是,你是否真正理解了這些特性背后的原理和機制呢冠胯?

例如火诸,如何判斷一個函數(shù)是否標記了 async

今天跟著子辰來看這道字節(jié)的面試題,相信會對你有所幫助

/**
 * 字節(jié)面試題:
 * 判斷傳入的函數(shù)是否標記了 async
 * */
function isAsyncFunction(func) {}

isAsyncFunction(() => {}); // expect:false
isAsyncFunction(async () => {}); // expect:true

通過本文你將會學習如何用一種簡單而準確的方法來判斷一個函數(shù)是否標記了 async荠察,以及這個方法背后的原理和知識點置蜀。

讓我們開始吧奈搜!

分析解題

面試題要求我們寫一個函數(shù)來判斷傳入的函數(shù)是否標記了 async,并給出兩個示例盯荤,傳入一個普通函數(shù)的話就返回 false馋吗,傳入一個 async 函數(shù)的話就返回 true

子辰首先幫你排除一個錯誤的解答,有些同學可能會想到廷雅,可以在 isAsyncFunction 里直接調(diào)用 func耗美,如果它返回的是一個 Promise,那么它就標記了 async航缀,但是這樣做是不行的商架。

首先你并不知道這個函數(shù)要傳遞多少個參數(shù),參數(shù)怎么傳遞芥玉,有些函數(shù)可能有很多個參數(shù)蛇摸,但是你一個參數(shù)不傳就可能會報錯了。

其次是這個函數(shù)可能沒有標記 async 卻依然返回 Promise灿巧,比如 function f(){ return new Promise() }赶袄。

還有一種情況就是這個函數(shù)里有副作用,比如更改了全局的一些東西或者是發(fā)送了一個請求抠藕,那么這一調(diào)用這個函數(shù)的話饿肺,就造成了副作用,所以說調(diào)用是肯定不行的盾似。

那么現(xiàn)在我們沒思路就先觀察一下普通函數(shù)和標記了 async 的函數(shù)到底有什么區(qū)別仗嗦。

我們先在控制臺中輸出一下標記了 async 的函數(shù)建蹄。

可以看到在 async 函數(shù)的原型上有一個符號篙耗,而且是一個知名的符號懒闷,叫做 toStringTag,它的值是 AsyncFunction告抄。

我們在看一下普通函數(shù)撰茎。

可以看到在普通函數(shù)的原型上就沒有這么一個知名符號。

我們暫時不去考慮這個知名符號到底有什么作用打洼,由于它們存在這樣一個差別龄糊,所以說代碼就很好寫了,我們只要判斷這個函數(shù)是否帶這個知名符號拟蜻,并且值是 AsyncFunction 就可以了绎签。

function isAsyncFunction(func) {
  return func[Symbol.toStringTag] === "AsyncFunction";
}

console.log("function >>> ", isAsyncFunction(() => {}));
console.log("async function >>> ", isAsyncFunction(async () => {}));
console.log("function Promise >>> ", isAsyncFunction(() => {return new Promise()}));

可以看到無論什么情況都是可以的,現(xiàn)在可以準確的判斷這個函數(shù)酝锅,到底有沒有標記 async 了诡必。

接下來我們研究一下這個知名符號到底是什么作用。

在過去要判斷一個東西它是不是數(shù)組,經(jīng)常是這么判斷的爸舒。

通過字符串的第二個單詞就可以知道它是不是一個數(shù)組了蟋字,那么這種表達格式以前只針對部分的內(nèi)置對象有效。

如果說是我們自己寫的對象就是無效的扭勉。

得到的字符串里并不能把這個類型 F 給表達出來鹊奖,而且在過去這種行為是無法更改的。

但是到了 ES6 給我們提供了一種方式涂炎,可以更改這個行為忠聚,更改方式就是知名符號。

我們給 F 的原型上的 Symbol.toStringTag 賦值為一個字符串類型的大寫 F唱捣。

由于有了知名符號两蟀,我們可以看到 f 的原型上就出現(xiàn)了一個知名符號 "F",然后 Object.prototype.toString.call() 返回字符串的第二個單詞就變成了我們設置的 F震缭。

同理可得赂毯,async 函數(shù)它的原型上既然有這個知名符號,所以我們也可以使用下圖這種方式來判斷拣宰。

總結

通過這篇文章党涕,我們了解了如何用知名符號 Symbol.toStringTag 來判斷一個函數(shù)是否標記了 async。

這個知名符號是 ES6 新增的一種特性巡社,它可以讓我們自定義對象的類型膛堤,并且影響 Object.prototype.toString 方法的返回值。

這個知名符號不僅可以用來判斷 async 函數(shù)晌该,還可以用來判斷其他內(nèi)置對象骑祟,比如數(shù)組、Map气笙、Set 等等。

它也可以讓我們給自己定義的對象添加一個更有意義的類型怯晕,方便我們進行類型檢測和區(qū)分潜圃。

知名符號是一個非常有用的工具,我們應該掌握它的用法和原理舟茶,以便在實際開發(fā)中靈活運用谭期。

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市吧凉,隨后出現(xiàn)的幾起案子隧出,更是在濱河造成了極大的恐慌,老刑警劉巖阀捅,帶你破解...
    沈念sama閱讀 222,729評論 6 517
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件胀瞪,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機凄诞,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,226評論 3 399
  • 文/潘曉璐 我一進店門圆雁,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人帆谍,你說我怎么就攤上這事伪朽。” “怎么了汛蝙?”我有些...
    開封第一講書人閱讀 169,461評論 0 362
  • 文/不壞的土叔 我叫張陵烈涮,是天一觀的道長。 經(jīng)常有香客問我窖剑,道長坚洽,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,135評論 1 300
  • 正文 為了忘掉前任苛吱,我火速辦了婚禮酪术,結果婚禮上,老公的妹妹穿的比我還像新娘翠储。我一直安慰自己绘雁,他們只是感情好,可當我...
    茶點故事閱讀 69,130評論 6 398
  • 文/花漫 我一把揭開白布援所。 她就那樣靜靜地躺著庐舟,像睡著了一般。 火紅的嫁衣襯著肌膚如雪住拭。 梳的紋絲不亂的頭發(fā)上挪略,一...
    開封第一講書人閱讀 52,736評論 1 312
  • 那天,我揣著相機與錄音滔岳,去河邊找鬼杠娱。 笑死,一個胖子當著我的面吹牛谱煤,可吹牛的內(nèi)容都是我干的摊求。 我是一名探鬼主播,決...
    沈念sama閱讀 41,179評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼刘离,長吁一口氣:“原來是場噩夢啊……” “哼室叉!你這毒婦竟也來了?” 一聲冷哼從身側響起硫惕,我...
    開封第一講書人閱讀 40,124評論 0 277
  • 序言:老撾萬榮一對情侶失蹤茧痕,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后恼除,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體踪旷,經(jīng)...
    沈念sama閱讀 46,657評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,723評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了埃脏。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片搪锣。...
    茶點故事閱讀 40,872評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖彩掐,靈堂內(nèi)的尸體忽然破棺而出构舟,到底是詐尸還是另有隱情,我是刑警寧澤堵幽,帶...
    沈念sama閱讀 36,533評論 5 351
  • 正文 年R本政府宣布狗超,位于F島的核電站,受9級特大地震影響朴下,放射性物質發(fā)生泄漏努咐。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,213評論 3 336
  • 文/蒙蒙 一殴胧、第九天 我趴在偏房一處隱蔽的房頂上張望渗稍。 院中可真熱鬧,春花似錦团滥、人聲如沸竿屹。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,700評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽拱燃。三九已至,卻和暖如春力惯,著一層夾襖步出監(jiān)牢的瞬間碗誉,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,819評論 1 274
  • 我被黑心中介騙來泰國打工父晶, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留哮缺,地道東北人。 一個月前我還...
    沈念sama閱讀 49,304評論 3 379
  • 正文 我出身青樓甲喝,卻偏偏與公主長得像蝴蜓,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子俺猿,可洞房花燭夜當晚...
    茶點故事閱讀 45,876評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 一、xue的生命周期是什么 vue每個組件都是獨立的格仲,押袍,每個組件都有一個屬于他的生命周期,從一個組件創(chuàng)建凯肋、數(shù)據(jù)初始...
    康娜閱讀 851評論 0 0
  • 一谊惭、CSS問題 1.flex布局 display:flex; 在父元素設置,子元素受彈性盒影響,默認排成一行圈盔,如果...
    陳二狗想吃肉閱讀 591評論 0 9
  • 1.說說你對盒子模型的理解 當對一個文檔進行布局(layout)的時候豹芯,瀏覽器的渲染引擎會根據(jù)標準之一的 CSS ...
    Ysrenacer1_bcfd閱讀 2,125評論 0 19
  • html and css 1、doctype作用: !Doctype聲明叫做文件類型定義(DTD)驱敲,位于文檔中的最...
    梁笨笨閱讀 280評論 0 1
  • 1铁蹈、JS的數(shù)據(jù)類型只有浮點型,沒有整型众眨。null,underfined,boolean,number,string...
    6e5e50574d74閱讀 2,217評論 2 1