js逻辑运算符

541 阅读2分钟

逻辑运算符(&&、||、!)

js的逻辑运算符在开发中算是很常见的了,主要有三种&&(逻辑与)、逻辑或(||)和逻辑非(!)

1. &&(逻辑与)


  • 只有在第一个操作数和第二个操作数都为真的情况下,结果为真
  • 如果有一个为false,结果就为false
  • 当第一个条件为false时,就不再判断后面的条件
// 比较简单的例子
console.log(5>3 && 6>5); // true  两边等式都成立
console.log(5<3 && 6>5); // false  5<3返回false
console.log(5<3 && abcd); // false 当第一项为假,则后面不执行
// 实际运用
console.log(1 && 20); // 20
console.log(0 && 5); // 0 r 如果第一个参数为假,后面的操作不会执行,输出第一个操作数的值
console.log(4 && 0); // 0
console.log('hello' && ' '); // "" 两项为真,则输出第二项的值

// 为假的状态
console.log(false && ''); // false
console.log(0 && ''); // 0
console.log(undefined && null); // undefined
console.log(null && undefined); // null 
console.log(NaN && 0); // NaN
[总结:假的状态,非空即真,非0即真,undefined,null,NaN]

2. &&(逻辑或)


  • 只要有一个条件为true时,结果就为true
  • 当两个条件都为false时,结果才为false
  • 当一个条件为true时,后面的条件不再判断
// 比较简单的例子
console.log(5>3 || 6>5); // true  只要有一项为真,则结果为真
console.log(5<3 || 6<5); // false 两项都为假 
console.log(5<3 || abcd); // true 

// 实际应用
console.log(5 || 6); // 5 第一项为真则直接返回第一项
console.log('' || 6); // 6 第一项为假则直接返回第二项
// 为假的状态
console.log(false || ''); // ""
console.log(0 || ''); // ""
console.log(undefined || null); // null
console.log(null || undefined); // undefined 
console.log(NaN || 0); // 0
[第一项为假的状态,直接返回第二项,两项都为假也同样返回第二项]

3. !


  • 当条件为false时,结果为true;反之亦然
  • 具有隐式转换
console.log(!5); // false
console.log(!!5); // true
console.log(!0); //true
console.log(!!0); //false
console.log(![]); //false
console.log(!![]); //true
console.log(!""); //true
console.log(!!""); //false

4.优先级


优先级排列:! > && > ||

console.log(3||2&&5||0); // 3
[会先算2&&5的值为5,然后再3||5=>3,最后再3||0=>3,所以最终结果等于3]