JavaScript中的逻辑运算符详解！

今天我们来总结一下Js中的三种逻辑运算符：与 && 或 || 非 !

&&操作符（全真为真，有假则假）。

"与" 翻译过来就是并且的意思，只有当条件1到条件n都满足，结果才成立。

在JS中的&&又叫做 “短路与”，

意思就是在判断第一个表达式为fasle之后，就不必对后面的表达式进行判断了，因为但凡有false，结果肯定是false。

逻辑与可以操作任意数据类型的数据（这是JS与其他一些编程语言不一样的地方）

根据&&两端表达式的数据类型不同，可分为以下两种：

对于操作数为boolean类型的数据

1. true&&true ===>true;

2. true&&false===>false;

3. false&&true===>false;

4. false&&false ===>false.

1.从运算结果可以看出，操作数为boolean类型的数据，结果返回都是Boolean

2.上述例2和例3，计算结果虽然相同，但因为是“短路”操作，运行效率是不一样的。

对于操作数为非boolean类型的数据

先将其进行隐式类型转换，在进行判断，最终返回原值。

举几个实例说明一下：

<!DOCTYPE html>
<html lang="en">
 <head>
	<meta charset="UTF-8">
	<title>逻辑运算符</title>
     <script type="text/javascript">
        //当操作数为两个时，
   		console.log(5&&4+"\n"); // 5隐式转换之后为true，返回4
		console.log(4&&5+"\n"); // 4隐式转换之后为true，返回5
                console.log(""&&5+"\n"); //空字符串转换之后为false，返回""
		console.log(null&&5+"\n");  //操作符中存在null，结果就为null
		console.log(4&&undefined+"\n"); //操作符中存在undefined，结果就为null
		console.log(NaN&&5+"\n");  //操作符中存在NaN，结果就为null
        //当操作数为3个及以上时，
        console.log(5&&4&&6+"\n"); //结果为真时，返回最后一个数的原值 6
    </script>
 </head>
 <body>
 </body>
</html>

当操作数为非Boolean类型的时候，&&运算符依旧遵循“短路”运算法则：

以两个操作数为例：（表达式1&&表达式2）

1.如果第一个操作数隐式转换为Boolean之后为true，则返回第二个操作数；

2.如果第一个操作数隐式转换为Boolean之后为false，则返回第一个操作数；

3.在&&运算中，但凡操作数中有 null ，undefined ，NaN 这些特殊值，结果就返回这些值。（虽然这些值转换为Boolean之后为false，但返回是将这些值直接输出）

||或操作符（有真则真，全假则假）

同样道理，"或"翻译过来是或者的意思，只要n个条件中只有1个条件满足，结果就会返回真。

"或"也遵循“短路”运算，和“与”相反，当表达式1为true，就返回true，停止了对后面表达式的判断。

举几个实例说明一下：

<!DOCTYPE html>
<html lang="en">
 <head>
	<meta charset="UTF-8">
	<title>逻辑运算符</title>
     <script type="text/javascript">
        //当操作数为两个时，
   		console.log(5||4+"\n"); // 5隐式转换之后为true，返回5
		console.log(4||5+"\n"); // 4隐式转换之后为true，返回4
                console.log(""||5+"\n"); //空字符串转换之后为false，返回5
		console.log(null||5+"\n");  //null隐式转换之后为false，返回5
		console.log(4||undefined+"\n"); //4隐式转换之后为true，返回4
		console.log(NaN||5+"\n");  // NaN隐式转换之后为false，返回5
                //当操作数为3个及以上时，
                console.log(5||4||6+"\n"); //结果为真时，返回第一个数的原值 5    
      </script>
 </head>
 <body>
 </body>
</html>

以两个操作数为例：（表达式1||表达式2）

1.如果第一个操作数隐式转换为Boolean之后为true，则返回第一个操作数；

2.如果第一个操作数隐式转换为Boolean之后为false，则返回第二个操作数；

3.需要注意的是：||运算符不对 null, undefined, NaN 有特殊要求，而是将他们隐式转换为 false。

!非运算符（非真即假）
对于操作数为非boolean类型的数据

对一个boolean值进行取反操作，即：!true=false !fasle=true

对于操作数为非boolean类型的数据

首先将其转换为Boolean，在进行双取反（两次非运算操作）

Var a =10;  
console.log(typeof a); //  number
console.log(a);  //10

a=!!a; //  对a进行两次取反
console.log(typeof a);  //boolean
console.log( a);  // true

!!a==Boolean（a） 对a进行的两次非运算操作相当于是对a进行Bololean的强制类型转化。

像这种隐式类型转换用法更灵活，也比较方便，

Number转换为String

var a= 123;
a=a+"";  //相当于 String(a)或者 a.toString()
console.log(typeof a); //String
console.log(a);  //123

String转换为Number

var str="12345";
console.log(typeof str);   //string
var str=str*1;             //相当于Number（str）或parseInt（str）
console.log(typeof str);   //number
console.log(str);          //12345

所以字符串转化为数字类型，可以通过 str-0, str*1, str/1,这样的运算实现隐式类型转换。

另外需要注意的是，唯一没有+运算符，因为解释器会认为+号是字符串和数字的拼接。

JavaScript中的逻辑运算符详解！

猜你喜欢