void 运算符 void 运算符 对给定的表达式进行求值,然后返回 undefined 。 尝试一下 </div></section><section aria-labelledby="语法"><h2 id="语法"><a href="#语法">语法</a></h2><div class="section-content"><div class="code-example"><pre class="brush: js notranslate"><code><span class="token keyword">void</span> expression </code></pre></div></div></section><section aria-labelledby="描述"><h2 id="描述"><a href="#描述">描述</a></h2><div class="section-content"><p>这个运算符允许在表达式执行完成时,产生(某些地方)期望获得的 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a> 值。</p> <p><code>void</code> 运算符通常只用于获取 <code>undefined</code> 的原始值,一般使用 <code>void(0)</code>(等同于 <code>void 0</code>)。在上述情况中,也可以使用全局变量 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a> 来代替。</p> <p>需要注意考虑 <code>void</code> 运算符的<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_precedence">优先级</a>,以下加括号的表达式的例子可以帮助你清楚地理解 <code>void</code> 操作符的优先级:</p> <div class="code-example"><pre class="brush: js notranslate"><code><span class="token keyword">void</span> <span class="token number">2</span> <span class="token operator">===</span> <span class="token string">'2'</span><span class="token punctuation">;</span> <span class="token comment">// (void 2) === '2',返回 false</span> <span class="token keyword">void</span> <span class="token punctuation">(</span><span class="token number">2</span> <span class="token operator">===</span> <span class="token string">'2'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// void (2 === '2'),返回 undefined</span> </code></pre></div></div></section><section aria-labelledby="示例"><h2 id="示例"><a href="#示例">示例</a></h2><div class="section-content"/></section><section aria-labelledby="立即调用的函数表达式"><h3 id="立即调用的函数表达式"><a href="#立即调用的函数表达式">立即调用的函数表达式</a></h3><div class="section-content"><p>在使用<a href="/zh-CN/docs/Glossary/IIFE">立即调用的函数表达式</a>时,<code>function</code> 关键字不可直接位于语句开头,因为该表达式会被解析为<a href="zh-CN/docs/Web/JavaScript/Reference/Statements/function">函数声明</a>,并会在解析到代表调用的括号时产生语法错误。如果是匿名函数,那么如果函数被解析为声明,就会立即产生语法错误。</p> <div class="code-example"><pre class="brush: js example-bad notranslate"><code><span class="token keyword">function</span> <span class="token function">iife</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Executed!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// SyntaxError: Unexpected token ')'</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Executed!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// SyntaxError: Function statements require a function name</span> <p>为了使函数被解析为<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/function">表达式</a>,<code>function</code> 关键字必须出现在一个只接受表达式而不是语句的位置。这可以通过在关键字前加一个<a href="/zh-CN/docs/Web/JavaScript/Guide/Expressions_and_operators#%E4%B8%80%E5%85%83%E8%BF%90%E7%AE%97%E7%AC%A6">一元运算符</a>来实现,它只接受表达式作为操作数。函数调用的<a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_precedence">优先级</a>比一元运算符高,所以它将被首先执行。它的返回值(几乎总是 <code>undefined</code>)将被传递给一元运算符,然后立即被丢弃。</p> <p>在所有的一元运算符中,<code>void</code> 提供了最好的语义,因为它明确表示函数调用的返回值应该被丢弃。</p> <div class="code-example"><pre class="brush: js notranslate"><code><span class="token keyword">void</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Executed!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// Output: "Executed!"</span> <p>这比用圆括号包裹函数表达式要长一些,圆括号的作用是强迫 <code>function</code> 关键字被解析为表达式的开始,而不是语句。</p> <div class="code-example"><pre class="brush: js notranslate"><code><span class="token punctuation">(</span><span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">"Executed!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div></div></section><section aria-labelledby="javascript_uri"><h3 id="javascript_uri"><a href="#javascript_uri">JavaScript URI</a></h3><div class="section-content"><p>当用户点击一个以 <code>javascript:</code> 开头的 URI 时,它会执行 URI 中的代码,然后用返回的值替换页面内容,除非返回的值是 <a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/undefined"><code>undefined</code></a>。<code>void</code> 运算符可用于返回 <code>undefined</code>。例如:</p> <div class="code-example"><pre class="brush: html notranslate"><code><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>javascript:void(0);<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 这个链接点击之后不会做任何事情 <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>a</span> <span class="token attr-name">href</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>javascript:void(document.body.style.backgroundColor='green');<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> 点击这个链接会让页面背景变成绿色。 <p><strong>备注:</strong> 利用 <code>javascript:</code> 伪协议来执行 JavaScript 代码是不推荐的,推荐的做法是为链接元素绑定事件。</p>