一個令人困惑的 JavaScript 解析謎題
原文由 Hillel Wayne 于 發布,訂閱此部落格
這會印出什麼?
x
= 1
x
--> 0
仔細想想,再到瀏覽器主控台試試看!答案與解析就在下拉選單裡。
顯示答案
它會印出 1。
等等,什麼鬼
在一行的開頭(而且只有在行的開頭),--> 會被視為註解的開頭。這段 JavaScript 會被解析為
x = 1;
x; // 0
瀏覽器接著會顯示最後一個表達式的值,當然就是 1。
但為什麼會這樣
這是歷史遺留下來的 hack。
Netscape Navigator 2 同時引入了 JavaScript 和 <script> 標籤。當時常見的舊版瀏覽器(如 Navigator 1)根本不知道 <script> 裡的內容有什麼特別,會直接把它當成一般文字顯示在頁面上。為了確保優雅降級,網頁開發者會把程式碼包在HTML 註解區塊裡:
<script>
<!--
console.log("hello world!")
-->
</script>舊版瀏覽器會把這些內容當成 HTML 註解並忽略,新版瀏覽器則會把它當成 JavaScript 來解析並執行。我不太確定為什麼 <!-- 和 --> 不會造成語法錯誤;推測 JavaScript 引擎裡應該有特別處理它們的程式碼,但我還沒搞清楚是在哪裡。
至少所有現代瀏覽器都認得 <script>。1 但由於有些老網站仍在使用這個 hack,而標準化委員會永遠、永遠不會破壞既有網路的相容性,他們在2015 年標準中把 <!-- 和 --> 加入為合法的註解標記。
<!--和-->的作用都跟//一樣,也就是用來起始行註解。-->只有在行的開頭才有效(為了避免與後綴遞減後接大於運算子的情況產生歧義),而<!--則可以在一行中的任何位置出現。 — MDN Web Docs
網頁瀏覽器必須支援這種語法,而其他引擎則不必。不過,Node 和 Electron 都有支援,因為它們共用 Chromium 的 V8 引擎。
- 像 Lynx 這類純文字瀏覽器也能辨識這個標籤,只是選擇忽略其內容。[返回]
隨機一篇部落格
留言
登入後參與討論