JavaScript 什么是void，什么时候使用void类型

在本文中，我们将了解JavaScript中的void运算符，以及讨论可以使用void运算符的特定条件，并通过示例了解它们的实现。

JavaScript中的void关键字 用于评估不返回任何值的表达式。void运算符 是一元运算符，接受单个操作数，可以是任何类型。当我们只需要评估一个表达式而不是返回其值时，void关键字的重要性就发挥出来了。这意味着，通过使用它，我们可以阻止浏览器显示表达式执行的结果。

语法：

void expression
void(expression)

void 运算符 具有运算符优先级，即在解析具有多个运算符执行操作的语句时，将给予运算符优先级。在这里，我们使用括号来表示表达式的目的，根据其优先级。

例如，考虑下面的示例：

void (10 == '10') // undefined
void 10 == '10' // false

对于第一个案例，在与字符串进行比较时，在带有void关键字的括号内，它返回undefined。而在第二个案例中，当表达式直接使用void关键字进行评估时，它返回false。

示例： 此示例描述了返回undefined的值。

HTML

<script> 
       function foo() { 
           return void 0; 
       } 
       console.log(foo()); 
</script>

输出：

undefined

void 0 可以用作占位符URL，表示单击事件与链接链接紧密相关，在实际操作中执行实际操作。void 0 也常用于代码精简，因为它是一种表示未定义的方式。

void运算符可以使用的情况有3个：

Active Javascript URLs:****javascript: 被称为伪URL，当我们将其作为 “href” 的值提供给锚标签时，浏览器会评估跟随“:”符号之后的表达式。另一方面，跟随“:”的表达式通常用作引用路径。

void运算符最常用于管理javascript: URL(s)，因为它使浏览器能够显示评估表达式的结果，而不是客户端返回的评估表达式的值。

示例: 在此示例中，链接将背景颜色更改为绿色，而不向浏览器返回任何值。

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>Using Void in URLs</title> 
</head> 
  
<body> 
    <a href= 
"javascript:void(document.body.style.backgroundColor='#32CD32');"> 
        Click here to change the background color. 
    </a>  
</body> 
  
</html>

输出：

JavaScript 什么是void，什么时候使用void类型

非活动的 JavaScript URL： 在某些情况下，链接不需要导航到任何地方或执行任何操作。为了实现这一点，我们将伪URL（ javascript: ）与void( 0) 组合作为 href 的值，当点击该链接时，它告诉浏览器不返回/不执行任何操作。

示例： 此示例演示生成非活动的 JavaScript URL。

HTML

<html> 
  
<head> 
      <title>Creating Inactive URL</title> 
</head> 
    
<body> 
    <pre> 
        Syntax to make Inactive Javascript URLs: 
        <a href="javascript:void(0)">Click here to do nothing.</a> 
    </pre>  
</body> 
  
</html>

输出: 浏览器将会识别链接，但是链接不会做出任何反应。当将0作为参数传递给void时，它什么也不做或者什么也不返回。在这里，“点击这里什么也不做”的链接根本没有任何动作，正如输出中所示。

JavaScript 什么是void，什么时候使用void类型

箭头函数的抑制： 箭头函数提供了一种没有大括号的语法来返回表达式的值。为了确保函数表达式的返回值（当它没有用处时）不会以任何方式影响代码，可以将其传递给 void 运算符。

示例： 该示例解释了返回表达式值的用法。

HTML

<html> 
  
<head> 
    <title>Returning the value of an expression</title> 
</head> 
  
<body> 
    <h3>Here we see how we can return undefined value on purpose:</h3> 
      
    <script> 
        function someOtherFunction(num) { 
            return num + 1 
        } 
        const toReturnUndefined = () => void someOtherFunction(1); 
        console.log(toReturnUndefined()); 
    </script> 
</body> 
  
</html>

输出：

JavaScript 什么是void，什么时候使用void类型

有意返回 undefined 值：

我们可以将任何变量的值转换为 undefined 类型。

HTML

<html> 
  
<head> 
    <title>Returning Undefined Value on Purpose</title> 
</head> 
  
<body> 
    <h3>Click the following to Return the Undefined Value:</h3> 
    <input type="button" 
           value="Click Me" 
           onclick="genUValue();" /> 
      
    <script> 
        function genUValue() { 
            var g, f, h; 
            g = void(f = 13, h = 19); 
            document.write('g = ' + g); 
        } 
    </script> 
</body> 
  
</html>

输出：

JavaScript 什么是void，什么时候使用void类型

立即调用函数表达式（Immediately Invoked Function Expression）： 立即调用函数表达式（IIFE）是一种JavaScript函数，它在定义完成后立即执行。它们非常有用，因为它们不会轻易影响全局对象和远程变量的声明。我们可以使用void运算符 创建IIFEs，它将强制将函数视为表达式而不是声明。

示例：

HTML

<html> 
  
<head> 
    <title>Creating a IIFE Using the Void operator</title> 
</head> 
  
<body> 
    <h3>Here we are creating a IIFE Using the Void operator:</h3> 
      
  <script> 
        void function iife() { 
            console.log("IIFE is made with void operator"); 
        }(); 
        iife(); 
  </script> 
</body> 
  
</html>

输出：

JavaScript 什么是void，什么时候使用void类型