void(0) 在 JavaScript 中做了什么？

Question

这 void JavaScript 中的运算符 计算 表达式 并返回 undefined，乍一看，这个运算符似乎没什么用，但有 3 种情况你可能会看到 void 操作员在实践中。 以下是 3 个主要用例：

无覆盖 undefined

令人惊讶的是， undefined 是 JavaScript 中的有效变量名 。 下面的脚本将打印出两次 test。

const undefined = 'test';

function foo() {
  return undefined;
}

function bar(undefined) {
  return undefined;
}

console.log(foo());
console.log(bar('test'));

然而， void 是一个运算符。 这意味着，如果您尝试命名一个变量 void，JavaScript 会抛出以下错误。

SyntaxError: Unexpected token void

一些 JavaScript 项目更喜欢 void 0 代替 undefined 避免意外创建名为的变量 undefined，有 一个 ESLint 规则不允许 undefined 为此原因。

无操作 <a> 标签

的另一个用例 void 运营商是做一个 <a> 用一个标签 javascript: URI 什么都不做。 一个 <a> 标记不是有效的 HTML，除非它有 name 或者 href 财产，所以 javascript: void(0) 是一个常见的技巧 <a>标签在不添加实际链接的情况下正确呈现。

<a href="javascript:void(0)">Click Here</a>

以下是上述 HTML 的外观： 单击此处

立即调用函数表达式 (IIFE)

要声明一个函数并在同一语句中执行它，您通常会使用括号来 强制 JavaScript 将函数声明作为表达式处理 。

(function() { console.log('Hello, World'); })(); // Prints "Hello, World"

您可能偶尔会看到 void 运算符作为括号的替代。
因为 void 是一元运算符，它告诉 JavaScript 将函数声明视为表达式，因此下面的代码打印 Hello, World。

void function() { console.log('Hello, World'); }();

不同之处在于普通的 IIFE 仍然可以返回一个值，而使用 void 对于 IIFE 将始终评估为 undefined。

(function() { return 42; })(); // 42

void function() { return 42; }(); // undefined