深入理解void(0)

  • 内容
  • 相关

  前两天,饺子(pjax.cn)问我这个void(0)到底表达个什么意思,有什么用!问的我一脸懵逼。所以补习下

  一直以来,undefined 都不是 JavaScript 的关键字或保留字,这意味着我们可以修改 window.undefined 的值。

由于 undefined 会被频繁调用作为比较运算的操作数等原因,修改 undefined 的值是有弊端的,所以在 ES5 规范之后,window.undefined 被定义为不可写、不可配置的属性。

常见的 undefined:

  • 变量声明后未赋值,则变量会被自动赋值为 undefined

  • 函数中定义了一些形参,如果传入的实参少于预定义的形参,那么有一些形参就会匹配不到实参,继而会被自动赋值为 undefined

  • 没有返回值的函数,默认返回 undefined

void 运算符

void 运算符后面接一个表达式,无论表达式的内容是什么,只要跟在 void 之后都会被调用执行,执行完毕后 void 操作符返回 undefined

void (expression)

简而言之,使用 void 运算符有三种用处:

  • 生成 undefined

  • 让函数立即执行

  • 充当 javascript: 协议的 URI

生成 undefined

使用 void 0 生成 undefined 的做法由来已久,既减少了在原形链上查找 window.undefined 的时间,也避免了误用被修改过的 undefined

function checkLogin (loginName) {
    if (loginName === void 0) {
        console.log('Wrong!');
    } 
}

checkLogin();
// => 'Wrong!'

立即执行函数

运算符和函数组合使用,可以让函数立即执行。实际上,有许多运算符可以让函数立即执行,比如 +-!~ 以及本文提到的 void 等运算符。此外,还有最常见的小括号(不是运算符,会改变优先级):

(function(){
    console.log('立即执行');
})();
// => '立即执行'

充当 javascript: 协议的 URI

对于网页中的点赞收藏等按钮,如果使用 a 标签来实现的话,往往会用到 href="javascript:void(0)" 等类似的代码,这段代码的作用点击链接时让页面不跳转。

href="javascript:void(0)" 中,使用了一个以 javascript: 协议开头的 URI,浏览器默认会对冒号后面的代码求值,然后将结果显示在新的页面,但有一种情况例外,如果结果是 undefined,浏览器就不会刷新页面渲染新值了。

实际上,我们有很多方式实现点赞收藏的效果,无需使用这么 Hack 的方式——虽然这确实很方便。

javascript: 协议声明了 URL 的主体是任意的 javascript 代码,由 javascript 解释器编译执行,通常使用 javascript:URL 执行某些不改变当前页面文档的代码,要做到这一点,必须确保 URL 的最后一条语句没有返回值,比如使用 void 0

本文标签:

版权声明:若无特殊注明,本文皆为《司马迁》原创,转载请保留文章出处。

本文链接:深入理解void(0) - http://tv1314.com/post-379.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注

评论

16条评论
  1. avatar

    hawkhost Lv.1 Chrome 58.0.3029.110 Chrome 58.0.3029.110 Windows 7 Windows 7 回复

    哈哈,我还以为是那个在线通话软件呢!

    内蒙古 电信

    1. avatar

      Secret Lv.1 Chrome 59.0.3071.115 Chrome 59.0.3071.115 Mac OS X 10.12.1 Mac OS X 10.12.1 回复

      涨知识了。

      四川省达州市 电信

      1. avatar

        Godaddy专题 Lv.2 回复

        请问交换友情链接吗?

        江苏省苏州市 电信

        1. avatar

          Young小杰 Lv.1 回复

          看了一下,挺不错的

          四川省成都市 电信

            1. avatar

              洒点 Lv.1 回复

              洒大地

              北京市 联通

              1. avatar

                ′ 小陌。 Lv.2 回复

                滴!帅哥卡!打卡时间:上午10:14:58,请上车的乘客系好安全带~

                广东省深圳市南山区 电信

                1. avatar

                  godaddy优惠码 Lv.2 回复

                  朋友,交换链接吗?

                  江苏省苏州市 电信

                  1. avatar

                    起点终站 Lv.3 回复

                    正在了解原型链。。你来科普下?

                    福建省厦门市 电信

                    1. 鬼少 回复

                      回复了起点终站:原型链这个东西,你知道有就行了。过时了的

                      广东省深圳市 电信

                    2. 起点终站 Lv.3 回复

                      回复了鬼少:大哥你好厉害,我好佩服你啊,我要给你生猴子啊。。。

                      福建省厦门市 电信

                    3. 鬼少 回复

                      回复了起点终站:洗刷我吗

                      广东省深圳市 电信

                    4. 起点终站 Lv.3 回复

                      回复了鬼少:

                      福建省厦门市 联通

                    5. 起点终站 Lv.3 回复

                      回复了鬼少:咦,发现bug,不能回复emoji

                      福建省厦门市 联通

                    6. 鬼少 回复

                      回复了起点终站:瓦特

                      广东省深圳市 电信

                    7. 起点终站 Lv.3 回复

                      回复了鬼少:就是不支持回复emoji表情!!!!,,看我上一条,变空白了

                      福建省厦门市 电信

                  00:00 / 00:00
                  顺序播放