美文网首页
逻辑运算符'||'和'&&'

逻辑运算符'||'和'&&'

作者: 神奇的少年 | 来源:发表于2017-02-27 23:38 被阅读0次

    我看到有一个面试题是alert(1&&2);答案是返回2.
    很少见的题目,对逻辑与和逻辑或考察的很细...于是乎决定展开一系列简单的问题...


    逻辑与('&&')

    直接看真值表

    var result=teur&&false;
    
    第一个操作数 第二个操作数 结果
    true true true
    true false false
    false true false
    false false false

    逻辑与(&&)操作可以应用于任何类型的操作数,不仅仅是布尔类型,它还遵循以下规则:

    (1)如果第一个操作的是对象,则返回第二个操作数

    alert('a'&&1);//返回1
    alert('a'&&false);//返回false
    

    (2)如果第二个操作的是对象,则只有在第一个操作的求值结果为true的情况下,才会返回该对象

    alert(1&&'a');//返回a
    alert(0&&'a');//返回0
    

    (3)如果两个操作数都是对象,则返回第二个操作数

    alert('a'&&'b');//返回b
    

    (4)如果有一个操作数是null,则返回null

    alert(null&&1);//返回null
    

    (5)如果有一个操作数是NaN,则返回NaN

    alert(NaN&&1);//返回NaN
    

    (6)如果有一个操作数是undefined,则返回undefined

    alert(undefined&&1);//返回undefined
    

    逻辑与操作属于短路运算,就是如果第一个操作数能够决定结果,则不会对第二个操作数求值

    也就是说如果第一个操作数是false的话,则无论第二个操作数的值是什么,结果都不可能再为true了

    我们看看下面这个栗子

    var found=true;
    var result=(found&&someUndefinedVariable);//会报错
    alert(result);//不会执行
    

    在上面代码中,found为true,所以逻辑与操作符会继续对变量someUndefinedVariable求值,但是someUndefinedVariable没有定义,就会报错,也就说明不能再逻辑与操作中使用未定义的值

    如果把found改为false的话,则不会继续对someUndefinedVariable求值,也就不会报错

    var found=false;
    var result=(found&&someUndefinedVariable);//没有报错了
    alert(result);//false
    

    逻辑或('||')

    直接看真值表

    第一个操作数 第二个操作数 结果
    true true true
    true false true
    false true true
    false false false

    逻辑或(||)操作如果有一个不是布尔值,逻辑或也不一定返回布尔值,它还遵循以下规则:

    (1)如果第一个操作数是对象,则返回第一个操作数;

    alert('a'||false);//返回a
    alert('a'||true);//返回a
    

    (2)如果第一个操作数的求值结果为false,则返回第二个操作数

    alert(false || 'a');//返回a
    alert(0 || 'a');//返回a
    

    (3)如果两个操作数都是对象,则返回第一个操作数

    alert('b' || 'a');//返回b
    

    (4)如果两个操作数都是null,则返回null

    alert(null||null);//返回null
    alert(null||1);//返回1
    alert(null||0);//返回0
    

    (5)如果两个操作数都是NaN,则返回NaN

    alert(NaN||NaN);//返回NaN
    alert(NaN||1);//返回1
    alert(NaN||0);//返回0
    

    (6)如果两个操作数都是undefined,则返回undefined

    alert(undefined||undefined);//返回undefined
    alert(undefined||1);//返回1
    alert(undefined||0);//返回0
    

    逻辑或操作符也是短路运算,如果第一个操作数的求值结果为true的话,就不会对第二个操作数求值了

    我们用上面的栗子来看看

    var found=true;
    var result=(found||someUndefinedVariable);//不会
    alert(result);//返回true
    

    再看看found改为false

    var found=false;
    var result=(found||someUndefinedVariable);//报错
    alert(result);//不会执行
    

    跟上面道理一样

    我们可以利用逻辑或来避免为变量赋null或undefined值

    var myObject=preferredObject || backupObject;
    

    变量preferredObject包含有优先赋给myObject的值,变量backupObject负责在preferredObject中不包含有效值的情况下提供后备值得.

    也就是说如果preferredObject的值不是null的话,就会被赋给myObject,如果是null的话,backupObject的值将被赋给myObject;

    可以理解为这样

    alert(null || undefined);//返回undefined
    

    接下来看看一些题目了

    alert(0||1);
    

    上面代码返回1,相当于false||true结果为true

    alert(2||1);
    

    上面代码返回2,前面2是true,1也是true

    alert('a'||1);
    

    上面代码返回a,如果第一个操作数是对象,则返回第一个操作数;

    alert(''||1);
    

    上面代码返回1,' '为false

    alert('a'||0);
    

    上面代码返回a,如果第一个操作数是对象,则返回第一个操作数;

    alert('a'||'b');
    

    上面代码返回a,如果操作数都是对象,则返回第一个操作数;

    alert(''||0);
    

    上面代码返回0,' '为false

    alert(0||'');
    

    上面代码返回' ',0为false


    alert(''&&1);
    

    上面代码返回' ',false&&true返回false

    alert(''&&0);
    

    上面代码返回' ',false&&false返回false

    alert('a'&&1);
    

    上面代码返回1,如果第一个操作数是对象,则返回第二个操作数

    alert('a'&&0);
    

    上面代码返回0,如果第一个操作数是对象,则返回第二个操作数

    alert('a'&&' ');
    

    上面代码返回' ',如果第一个操作数是对象,则返回第二个操作数

    alert(0&&'a');
    

    上面代码返回0',0为false

    alert(0&&' ');
    

    上面代码返回0',0为false


    下面再看一道题

    alert(1 || 'a' && 2);
    

    解:因为&&操作符比||操作符优先级要高,所以得出

    alert('a' && 2);//返回2,第一个操作数是对象,则返回第二个操作数
    

    得出以下

    alert(1||2);
    

    返回1,如果第一个操作数的求值结果为true的话,就不会对第二个操作数求值了

    你也可以说,因为这样,知道了&&优先级比 || 要高哈哈哈哈哈

    那我们再看回我开头说的那一题

    alert(1&&2);
    

    返回2,只要&&前面是true,无论后面是true还是false,都返回&&后面的值


    好了,就说到这吧,还要赶紧把其他笔记搬上来,等我梳理好了,会一并推到GitHub上.工程量有点大,坚持每天码几篇上来!

    以上内容参考--javascript高级程序设计(第三版),还有(穆乙’s Blog 专注前端技术)的博客,点击查看

    相关文章

      网友评论

          本文标题:逻辑运算符'||'和'&&'

          本文链接:https://www.haomeiwen.com/subject/lyitgttx.html