En este artículo, sabremos qué es el operador de vacío en Javascript, además de discutir la condición particular en la que se puede usar el operador de vacío y comprender su implementación a través de los ejemplos.
La palabra clave void en JavaScript se utiliza para evaluar una expresión que no devuelve ningún valor. El operador void es un operador unario que acepta un solo operando, que puede ser de cualquier tipo. La importancia de la palabra clave void entra en juego cuando solo necesitamos evaluar una expresión en lugar de devolver su valor. Significa que, al usarlo, podemos evitar que el navegador muestre el resultado de la ejecución de la expresión.
Sintaxis :
void expression void(expression)
El operador void tiene una precedencia de operadores , es decir, se dará prioridad a los operadores mientras se analiza una declaración que tiene más de un operador realizando operaciones en ella. Aquí, hemos usado el paréntesis, para expresar el propósito de la expresión, según su precedencia.
Por ejemplo, considere el siguiente ejemplo:
void (10 == '10') // undefined void 10 == '10' // false
Para el primer caso, cuando el número se compara con una string, dentro del paréntesis con la palabra clave void, devuelve indefinido, mientras que en el segundo caso, cuando la expresión se evalúa directamente con la palabra clave void, devuelve falso.
Ejemplo: este ejemplo describe el valor indefinido que se devuelve.
HTML
<script>
function foo() {
return void 0;
}
console.log(foo());
</script>
Producción:
undefined
void 0 se puede usar como una URL de marcador de posición que representa un evento onclick vinculado al enlace para realizar la acción real. El void 0 también se usa comúnmente en la reducción del tamaño del código, ya que es una forma de escribir indefinida.
Hay 3 casos en los que se puede utilizar el operador void:
URL activas de Javascript: el javascript: se denomina pseudo URL, cuando lo proporcionamos como un valor de «href» en una etiqueta de anclaje, el navegador evalúa la expresión que sigue al símbolo «:». Por otro lado, la expresión que sigue al “:” se suele utilizar como ruta referenciada.
El operador void se usa más comúnmente en la gestión de javascript: URL (s) porque permite que el navegador muestre el resultado final de la evaluación de la expresión en lugar del valor devuelto de la expresión evaluada en el lado del cliente.
Ejemplo : en este ejemplo, el enlace cambia el color del fondo a verde sin devolver ningún valor al navegador.
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>
Producción:
URL de Javascript inactivas: en algunos casos, un enlace no lo requiere para navegar a ningún lado o hacer nada. Para lograrlo, combinamos la pseudo URL ( javascript: ) con void( 0 ) como valor de un href, le dice al navegador que regrese/no haga nada cuando se hace clic en ese enlace.
Ejemplo: este ejemplo explica cómo generar la URL de Javascript inactiva.
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>
Salida: El enlace será reconocido por el navegador pero el enlace no reacciona en absoluto. Cuando se pasa 0 a void como argumento, no hace nada o no devuelve nada. Aquí el enlace «Haga clic aquí y no haga nada» no hace nada en absoluto, como se muestra en la salida.
Supresión de funciones de flecha: las funciones de flecha proporcionan una sintaxis sin llaves para devolver el valor de una expresión. Para asegurarse de que el valor de retorno de la expresión de la función (cuando no sirve) no afecte el código de ninguna manera, se puede pasar a un operador void.
Ejemplo: Este ejemplo explica cómo devolver el valor de una expresión.
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>
Producción:
Devolver un valor indefinido a propósito: podemos convertir el valor de cualquier variable en un tipo indefinido.
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>
Producción:
Expresión de función invocada inmediatamente: una expresión de función invocada inmediatamente (IIFE) es un tipo de función Javascript que se ejecuta tan pronto como se define. Son muy útiles porque no afectan el objeto global y las declaraciones de variables remotas muy fácilmente. Podemos usar el operador void para crear IIFE. Obligará a que la función sea tratada como una expresión en lugar de una declaración.
Ejemplo:
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>
Producción:
Publicación traducida automáticamente
Artículo escrito por priyanshuchatterjee01 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA