JS中所有物件都是truthy?除了他...

卡頌發表於2021-12-07

大家好,我卡頌。

根據ES規範規定,所有非原始型別的物件轉化為Boolean都為true

但是這裡有個特例:document.all

本文就來聊聊這個冷知識。

document.all的作用

document.all會返回一個HTMLAllCollection集合,包含document下所有節點。可以理解為是一個包含頁面中所有DOM節點的集合

早期的web開發者用該API獲取DOM節點,比如:

// 獲取頁面中第一個節點,即HTML
document.all[0];

// 獲取頁面中id為"abcd"的節點
document.all["abcd"];

隨著WEB發展,其作用已經逐漸被document的其他方法取代,比如:

  • getElementById
  • querySelector

......

負重前行的W3C

雖然有了更好用的API,但很多老頁面還在使用document.all。如何更好的過渡呢?

為了相容,很多開發者會寫出如下程式碼:

if (document.all) {
  // 老瀏覽器
} else if (document.getElementById) {
  // 支援getElementById的現代瀏覽器
}

問題是,很多現代瀏覽器也實現了document.all,這就會讓程式碼在所有瀏覽器中都進入老瀏覽器的邏輯。

從09年6月到10月,關於document.allW3C郵件列表有56封之多。

第一封討論郵件

最後的討論結果是:在現代瀏覽器中,document.all轉化為Boolean的結果為false

這樣,上述程式碼在現代瀏覽器下就不會進入老瀏覽器的邏輯。

總結

除了以上特性,document.all還有些異於常人的特性,比如:

  • 當被作為==!=操作符的比較物件時,會被當作undefined
  • typeof document.all === 'undefined'

這些古怪結果都是為了瀏覽器向下相容。雖然很多現代瀏覽器都支援document.all,但他已經從標準中刪除。

我能想到他當前唯一的作用,大概就是和麵試官抬槓吧......

歡迎加入人類高質量前端框架群,帶飛

相關文章