js中两个感叹号的原理与用法分析

         在javascript中有时会看到有两个!!的用法。我很少用到（本人在js方面是菜鸟），但是在一些开源框架（如jquery）中经常看到。所以参考网上的相关资料总结了一下它的用法。

         

var foo;
alert(!foo);//undifined情况下，一个感叹号返回的是true;
alert(!goo);//null情况下，一个感叹号返回的也是true;
var o={flag:true};
var test=!!o.flag;//等效于var test=o.flag||false;
alert(test);

          这段例子，演示了在undifined和null时，用一个感叹号返回的都是true,用两个感叹号返回的就是false,所以两个感叹号的作用就在于，如果明确设置了变量的值（非null/undifined/0/""等值),结果就会根据变量的实际值来返回，如果没有设置，结果就会返回false。

 

grep: function( elems, callback, inv ) {
        var ret = [], retVal;
        inv = !!inv;

        // Go through the array, only saving the items
        // that pass the validator function
        for ( var i = 0, length = elems.length; i < length; i++ ) {
            retVal = !!callback( elems[ i ], i );
            if ( inv !== retVal ) {
                ret.push( elems[ i ] );
            }
        }

        return ret;
    }

     这是jquery中一个比较经典的例子,

     在使用grep函数的时候，如果给出了第三个参数且非null/undefined/0""/等值，则inv为     true，否则为false。这样做的目的就是保证inv和retVal的值都只能在true/false中取，而非其它值，为后续判断提供便利。

评论

18 楼 ToBeImmortal 2013-10-19  

ADT的“封装”

17 楼 linweibin 2013-02-19  

JavaSam 写道

嗯，不错!
像js这种本来就很难解释清楚的东西，lz已经很厉害了！

我是js菜鸟

16 楼 JavaSam 2013-02-19  

嗯，不错!
像js这种本来就很难解释清楚的东西，lz已经很厉害了！

15 楼 sanshizi 2013-02-19  

受益匪浅:　这样做的目的就是保证xxxx的值都只能在true/false中取　 

14 楼 rox 2013-02-19  

这个在犀牛书里面有提到过，是一种类型转换的小技巧。
因为javascript是弱类型的，例如
0==null是true，但它们都不是真正的bool类型。
!!0  （false）
!!null （false）
!!'' （false）
!!'false' （true）
这种用法是特定需要的时候，比如一定要求是bool类型时才用，
或者用强类型语言的概念来规范代码，也是不错的。

13 楼 linweibin 2013-02-19  

white_crucifix 写道

linweibin 写道

white_crucifix 写道

我试了一下，怎么结果和楼主说的不一样啊

var o={flag:1};  
var test=!!o.flag;//等效于var test=o.flag||false;

我把flag的值改成1


var test=!!o.flag;  值为true
var test=o.flag||false;  值为1
不等效啊……囧

我只是举了flag是 true时的例子才说的等效，你改变条件了，还在那儿等效啊?

我是看到这句“如果明确设置了变量的值（非null/undifined/0/""等值),结果就会根据变量的实际值来返回，如果没有设置，结果就会返回false。”在回过去试验的。
你说的没什么错，就是可能有些地方造成了歧义。开始看标题以为双叹号有什么特殊的功能，心想怎么从来没学到过，震惊了一下。其实就是两个叹号功能的重叠。
后面这句总结的比较到位“这样做的目的就是保证xxxx的值都只能在true/false中取”。
^_^

恩恩，谢谢支出不足，呵呵，本想着很少使用两个叹号，今天看一个框架的时候看到了，就总结了一下，感觉双叹号确实带来了很大的方便，让逻辑更清楚

12 楼 linweibin 2013-02-19  

leaow567 写道

第一个感叹号是把其它值转换为布尔值，第二个感叹号是取反，这是js基础吧

对啊，我说这种用法很少用，但是在很多js开源框架中用的很多，所以写了篇博文记录一下，没有特殊的用意

11 楼 white_crucifix 2013-02-18  

linweibin 写道

white_crucifix 写道

我试了一下，怎么结果和楼主说的不一样啊

var o={flag:1};  
var test=!!o.flag;//等效于var test=o.flag||false;

我把flag的值改成1


var test=!!o.flag;  值为true
var test=o.flag||false;  值为1
不等效啊……囧

我只是举了flag是 true时的例子才说的等效，你改变条件了，还在那儿等效啊?

我是看到这句“如果明确设置了变量的值（非null/undifined/0/""等值),结果就会根据变量的实际值来返回，如果没有设置，结果就会返回false。”在回过去试验的。
你说的没什么错，就是可能有些地方造成了歧义。开始看标题以为双叹号有什么特殊的功能，心想怎么从来没学到过，震惊了一下。其实就是两个叹号功能的重叠。
后面这句总结的比较到位“这样做的目的就是保证xxxx的值都只能在true/false中取”。
^_^

10 楼 leaow567 2013-02-18  

第一个感叹号是把其它值转换为布尔值，第二个感叹号是取反，这是js基础吧

9 楼 linweibin 2013-02-18  

white_crucifix 写道

我试了一下，怎么结果和楼主说的不一样啊

var o={flag:1};  
var test=!!o.flag;//等效于var test=o.flag||false;

我把flag的值改成1


var test=!!o.flag;  值为true
var test=o.flag||false;  值为1
不等效啊……囧

我只是举了flag是 true时的例子才说的等效，你改变条件了，还在那儿等效啊?

8 楼 linweibin 2013-02-18  

eyei 写道

什么玩意儿啊！与其说两个叹号的用法不如说一个的用法！LZ真逗

你可能没有理解，两个叹号使计算结果限定在true/false,用一个叹号对于null和undifined的处理不但不好理解，而且效率很低。两个叹号的用法，只是说他的一种用法而已，条条大路通罗马。不用说一个叹号，不用叹号用Boolean都可以解决，不要太拘泥于自己的知识

7 楼 eyei 2013-02-18  

什么玩意儿啊！与其说两个叹号的用法不如说一个的用法！LZ真逗

6 楼 white_crucifix 2013-02-18  

我试了一下，怎么结果和楼主说的不一样啊

var o={flag:1};  
var test=!!o.flag;//等效于var test=o.flag||false;

我把flag的值改成1


var test=!!o.flag;  值为true
var test=o.flag||false;  值为1
不等效啊……囧

5 楼 laoji 2013-02-18  

linweibin 写道

jiangwenxian 写道

负负得正，是这个原理不？

呵呵，可以这样理解啊

good

4 楼 linweibin 2013-02-18  

jiangwenxian 写道

负负得正，是这个原理不？

呵呵，可以这样理解啊

3 楼 linweibin 2013-02-18  

lazy_ 写道

写得好！null/undifined/0/""再加上一个NaN

嗯，等等嘛

2 楼 lazy_ 2013-02-18  

写得好！null/undifined/0/""再加上一个NaN

1 楼 jiangwenxian 2013-02-18  

负负得正，是这个原理不？