空操作符

void 运算符计算给定的 expression,然后返回 undefined

¥The void operator evaluates the given expression and then returns undefined.

Try it

语法

¥Syntax

js
void expression

描述

¥Description

该运算符允许对生成值的表达式求值到需要计算结果为 undefined 的表达式的位置。

¥This operator allows evaluating expressions that produce a value into places where an expression that evaluates to undefined is desired.

void 运算符通常仅用于获取 undefined 原始值,通常使用 void(0)(相当于 void 0)。在这些情况下,可以使用全局变量 undefined

¥The void operator is often used merely to obtain the undefined primitive value, usually using void(0) (which is equivalent to void 0). In these cases, the global variable undefined can be used.

应该注意的是,应考虑 void 运算符的 优先级,并且括号可以帮助阐明 void 运算符后面的表达式的解析:

¥It should be noted that the precedence of the void operator should be taken into account and that parentheses can help clarify the resolution of the expression following the void operator:

js
void 2 === "2"; // (void 2) === '2', returns false
void (2 === "2"); // void (2 === '2'), returns undefined

示例

¥Examples

立即调用的函数表达式

¥Immediately Invoked Function Expressions

当使用 立即调用函数表达式 时,function 关键字不能位于 statement 的直接开头,因为这会被解析为 函数声明,并且当到达代表调用的括号时会生成语法错误 - 如果函数未命名,它会立即 如果函数被解析为声明,则为语法错误。

¥When using an immediately-invoked function expression, the function keyword cannot be at the immediate start of the statement, because that would be parsed as a function declaration, and would generate a syntax error when the parentheses representing invocation is reached — if the function is unnamed, it would immediately be a syntax error if the function is parsed as a declaration.

js
function iife() {
  console.log("Executed!");
}(); // SyntaxError: Unexpected token ')'

function () {
  console.log("Executed!");
}(); // SyntaxError: Function statements require a function name

为了使函数被解析为 expressionfunction 关键字必须出现在只接受表达式而不是语句的位置。这可以通过在关键字前加上 一元运算符 来实现,它只接受表达式作为操作数。函数调用比一元运算符具有更高的 precedence,因此将首先执行。它的返回值(几乎总是 undefined)将被传递给一元运算符,然后立即被丢弃。

¥In order for the function to be parsed as an expression, the function keyword has to appear at a position that only accepts expressions, not statements. This can be achieved by prefixing the keyword with a unary operator, which only accepts expressions as operands. Function invocation has higher precedence than unary operators, so it will be executed first. Its return value (which is almost always undefined) will be passed to the unary operator and then immediately discarded.

在所有一元运算符中,void 提供了最好的语义,因为它清楚地表明函数调用的返回值应该被丢弃。

¥Of all the unary operators, void offers the best semantic, because it clearly signals that the return value of the function invocation should be discarded.

js
void function () {
  console.log("Executed!");
}();

// Logs "Executed!"

这比将函数表达式括在括号中要长一些,后者具有强制将 function 关键字解析为表达式而不是语句的开头的相同效果。

¥This is a bit longer than wrapping the function expression in parentheses, which has the same effect of forcing the function keyword to be parsed as the start of an expression instead of a statement.

js
(function () {
  console.log("Executed!");
})();

JavaScript URI

当浏览器遵循 javascript: URI 时,它会评估 URI 中的代码,然后用返回值替换页面内容,除非返回值是 undefinedvoid 运算符可用于返回 undefined。例如:

¥When a browser follows a javascript: URI, it evaluates the code in the URI and then replaces the contents of the page with the returned value, unless the returned value is undefined. The void operator can be used to return undefined. For example:

html
<a href="javascript:void(0);">Click here to do nothing</a>

<a href="javascript:void(document.body.style.backgroundColor='green');">
  Click here for green background
</a>

注意:与其他替代协议(例如不引人注目的事件处理程序)相比,不鼓励使用 javascript: 伪协议。

¥Note: javascript: pseudo protocol is discouraged over other alternatives, such as unobtrusive event handlers.

非泄漏箭头函数

¥Non-leaking Arrow Functions

箭头函数引入了返回表达式的简写无括号语法。如果表达式是返回值从 undefined 更改为其他值的函数调用,则这可能会导致意外的副作用。

¥Arrow functions introduce a short-hand braceless syntax that returns an expression. This can cause unintended side effects if the expression is a function call where the returned value changes from undefined to some other value.

例如,如果 doSomething() 在下面的代码中返回 false,则当单击该复选框时,该复选框将不再被标记为选中或未选中(从处理程序返回 false 将禁用默认操作)。

¥For example, if doSomething() returns false in the code below, the checkbox will no longer be marked as checked or unchecked when the checkbox is clicked (returning false from the handler disables the default action).

js
checkbox.onclick = () => doSomething();

这不太可能是理想的行为!为了安全起见,当不打算使用函数的返回值时,可以将其传递给 void 运算符,以确保(例如)更改 API 不会导致箭头函数的行为发生更改。

¥This is unlikely to be desired behaviour! To be safe, when the return value of a function is not intended to be used, it can be passed to the void operator to ensure that (for example) changing APIs do not cause arrow functions' behaviors to change.

js
checkbox.onclick = () => void doSomething();

规范

Specification
ECMAScript Language Specification
# sec-void-operator

¥Specifications

浏览器兼容性

BCD tables only load in the browser

¥Browser compatibility

也可以看看

¥See also