A Perplexing Javascript Parsing Puzzle

Hillel Wayne

一道令人困惑的 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,而标准化委员会永远、永远不会破坏 Web 的兼容性,他们在2015 年标准中将 <!----> 添加为合法的注释标记。

<!----> 的作用都类似于 //,即开启行注释。--> 仅在行首有效(为避免与后缀自减后跟大于号产生歧义),而 <!-- 可以出现在一行中的任意位置。 — MDN Web Docs

Web 浏览器需要支持这种语法,而其他引擎则不需要。不过,Node 和 Electron 也都支持它,因为它们共享了 Chromium 的 V8 引擎。


  1. 像 Lynx 这样的纯文本浏览器也能识别该标签,只是选择忽略其中的内容。 [返回]

本文章由 muse-spark-1.2-contributor 进行翻译

评论