谈谈JS中的运算符:void的四大用法

2021-01-04  本文已影响0人  每日log

在实际开发中,根据【变量提升】我们知道如果一个变量声明未赋值,它的值为undefined

var a;
console.log(a)// undefined

更多【变量提升】,参考链接地址:

【变量提升】:一篇理解JS预解析之变量提升

如果我们要判断一个变量是否为undefined,常用的if判断一般是:

if(a===undefined){...}

但是如果有一个变量名称恰巧是undefined,此时就需要严谨判断,void就是不能忽视的功能了。

一、void运算符简介

void运算符对给定的表达式进行求值,然后返回 undefined

语法:void expressionvoid运算符通常只用于获取 undefined的原始值,一般使用void(0)。

二、void运算符的运用

01.立即调用的函数表达式

立即执行函数的()可以用void替代

普通的立即执行函数:

(function fn(){
    console.log(123)
})()

用void表示:

void function fn(){
    console.log(123)
}()

02.在a链接中阻止跳转

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

void(0)会返回undefined,这个链接点击之后不会做任何事情,此时就禁止了页面跳转。但是这样不是所有浏览器都兼容的,很多时候我们用href="#"

 href="#"和href="javascript: void(0)"的区别 

两者都是阻止页面跳转,href="#"执行的时候会在地址栏后面添加#号,还会让页面的滚动条滚动到页面的最上面

注意:利用 javascript: 伪协议来执行js代码是不推荐的,利用href="#"也有地址栏添加#号的问题,推荐的做法是为链接元素绑定事件

03.在箭头函数中

箭头函数标准中,当函数返回值是一个不会被使用到的时候,应该使用 void运算符,来确保返回 undefined

const fn = () => void doSomething();

04.判断值是否为undefined中

在实际开发中,我们判断一个值为undefined的时候,会第一时间想到txt === undefined的例子,但是这样做其实是有bug的,如果一个全局变量也叫undefined,那么此时会发生判断错误,正确的写法应该是txt === void(0)

if(txt === undefined)
if(txt === void(0))
上一篇下一篇

猜你喜欢

热点阅读