当前仅显示指定条件回帖 [ 展开查看全部 ]
文件名称:
JS中的逻辑运算符详解笔记.md
所在目录:
编程_前端开发学习笔记 / HTML+CSS+JS基础笔记 / JavaScript笔记
文件大小:
5.03 KB
下载地址:
文本预览:
> 遇到此类问题可以尝试百度关键词 **JS Operators logical** ,能比较准确地定位到相关知识点网站
# 一、JS中的逻辑或 || 、逻辑与 &&
> 首先**如果第一项的值不是Boolean值的话,会转为Boolean类型的**
>
> 在数值上,**0和-0在转为Boolean时为false**,其余为true
## Ⅰ- 问题提出
>我在平时写js代码时,一般也就使用&&和||判断true和false
>
>但是最近在看其他人代码与源码时,发现出现了大量逻辑或 || 、逻辑与 && 的其他用法,于是在此记录梳理一下
## Ⅱ - 逻辑或 ||
>```js
>console.log(1 || 2); //真或真 1
>console.log(1 || 0); //真或假 1
>console.log(0 || 2); //假或真 2
>console.log(-1 || 2); // 注意:只有0代表假,负数不为假,所以仍是真或真 -1
>console.log(0 || false); //假或假 false
>console.log(false || 0); //假或假 0
>console.log(true || false); //布尔值的真或假 true
>console.log(false || true); //布尔值的假或假 true
>```
>
>**逻辑或 ||** 规律总结:
>
>* 若 **||** 前方为**true**: 则返回运算符`前方`内容或运算结果;
>* 若 **||** 前方为 **false**: 则返回运算符`后方`的内容或运算结果
>* **||** 当第一位判断到为真,结果就已经是**真**,所以不用再走到运算符后方,只要将前方内容返回即可(true),反之相反
## Ⅲ - 逻辑与 &&
>```js
>console.log(1 && 2); //真并真 2
>console.log(1 && 0); //真并假 0
>console.log(0 && 2); //假并真 0
>console.log(-1 && 2); // 注意:只有0代表假,负数不为假,所以仍是真或真 2
>console.log(0 && false); //假并假 0
>console.log(false && 0); //假并假 false
>console.log(true && false); //布尔值的真或假 false
>console.log(false && true); //布尔值的假或假 false
>```
>
>**逻辑与 &&** 规律总结:
>
>* 若 **&&** 前方为 **true**: 则返回运算符`后方`内容或运算结果;
>* 若 **&&** 前方为 **false**: 则返回运算符`前方`的内容或运算结果
>* 因为 **true && false 为 true**,所以当运算符前方为 **true** 时,就靠的后方内容真假为最终结果,所以可以直接返回后方的内容作为运算结果,反之相反
## Ⅳ - 应用场景举例
>##### 转换成数组时根据特定条件去重
>
>```js
>let andObj = {}
>let orObj = {}
>let arr = ['努力学习的汪','努力学习的汪','hongjilin','努力学习的汪']
>//使用&& 运算符
>arr.map((item,index)=>{
> !andObj[item] && (andObj[item]=index) //当此属性名第一次出现时,赋予obj
>})
>//使用 || 运算符,其实判断就恰好与&&相反
>arr.map((item,index)=>{
> andObj[item] || (andObj[item]=index) //当此属性名第一次出现时,赋予obj
>})
>console.log(andObj) // {努力学习的汪: 1, hongjilin: 2}
>console.log(orObj) // {努力学习的汪: 1, hongjilin: 2}
>```
>
>这里只是举个偏例,实际上可以变换成很多适用场景
# 二、运算优先级
## Ⅰ- 以题入手
> 此部分我觉得仍是从各种题目入手,通过分析题目对此部分知识点进行梳理整合
>
> 如果要看更多JS面试题目可以点这里 --> **[JavaScript专项练习](https://gitee.com/hongjilin/hongs-study-notes/tree/master/面试_面试题整理/JavaScript专项练习)**
### 1、求下方打印结果
>```js
>var a = 18;
>var b = "努力学习的汪";
>var c = false;
>var d = a && b || c ? c || b ? a : c && b : a ;
>console.log(d)
>```
>
>##### 知识点梳理以及答案解析
>
>1. **&& 运算符的优先级高于 ||,而 || 的优先级又高于?** :
> - 所以我们对它进行第一次分解:**`((a && b) || c) ? (c || b) ? a : (c && b) : a`**
>2. **? : 是右关联**
> - 例如: a ? b : c ? d : e --> a ? b : (c ? d : e)
> - 所以进一步对上方进行分解 : **`((a && b) || c) ? ((c || b) ? a : (c && b)) : a`**
>3. **对于&&来说,如果条件判断结果为true就会返回第二个操作数的值,如果为false就会返回第一个操作数的值**
> - 此知识点在本人笔记 [一、JS中的逻辑或 || 、逻辑与 &&](#**一、JS中的逻辑或 || 、逻辑与 && **) 部分已经给出了详细解释
> - 所以对上方式子进行初步运算后可以得出: **`c ? ((c || b) ? a : c) : a`**
>4. **对于 || 来说,如果条件判断结果为true就会返回第一个操作数的值,如果为false就会返回第二个操作数的值;**
> - 此知识点在本人笔记 [一、JS中的逻辑或 || 、逻辑与 &&](#**一、JS中的逻辑或 || 、逻辑与 && **) 部分已经给出了详细解释
> - 所以对上方式子进行初步运算后可以得出: **`c ? (b ? a : c) : a`**
>5. 此时结果就非常明了了,下面给出结果变化
> - **`c ? (b ? a : c) : a`** ==> false ? ( "努力学习的汪" ? 18 : false) : 18
> - 经过隐式转换后 : **false ? (true ? 18: false) : 18**
> - 三元运算符可知,当**?**前为**false**,返回**:**后方的值 所以结果为`18`
# 一、JS中的逻辑或 || 、逻辑与 &&
> 首先**如果第一项的值不是Boolean值的话,会转为Boolean类型的**
>
> 在数值上,**0和-0在转为Boolean时为false**,其余为true
## Ⅰ- 问题提出
>我在平时写js代码时,一般也就使用&&和||判断true和false
>
>但是最近在看其他人代码与源码时,发现出现了大量逻辑或 || 、逻辑与 && 的其他用法,于是在此记录梳理一下
## Ⅱ - 逻辑或 ||
>```js
>console.log(1 || 2); //真或真 1
>console.log(1 || 0); //真或假 1
>console.log(0 || 2); //假或真 2
>console.log(-1 || 2); // 注意:只有0代表假,负数不为假,所以仍是真或真 -1
>console.log(0 || false); //假或假 false
>console.log(false || 0); //假或假 0
>console.log(true || false); //布尔值的真或假 true
>console.log(false || true); //布尔值的假或假 true
>```
>
>**逻辑或 ||** 规律总结:
>
>* 若 **||** 前方为**true**: 则返回运算符`前方`内容或运算结果;
>* 若 **||** 前方为 **false**: 则返回运算符`后方`的内容或运算结果
>* **||** 当第一位判断到为真,结果就已经是**真**,所以不用再走到运算符后方,只要将前方内容返回即可(true),反之相反
## Ⅲ - 逻辑与 &&
>```js
>console.log(1 && 2); //真并真 2
>console.log(1 && 0); //真并假 0
>console.log(0 && 2); //假并真 0
>console.log(-1 && 2); // 注意:只有0代表假,负数不为假,所以仍是真或真 2
>console.log(0 && false); //假并假 0
>console.log(false && 0); //假并假 false
>console.log(true && false); //布尔值的真或假 false
>console.log(false && true); //布尔值的假或假 false
>```
>
>**逻辑与 &&** 规律总结:
>
>* 若 **&&** 前方为 **true**: 则返回运算符`后方`内容或运算结果;
>* 若 **&&** 前方为 **false**: 则返回运算符`前方`的内容或运算结果
>* 因为 **true && false 为 true**,所以当运算符前方为 **true** 时,就靠的后方内容真假为最终结果,所以可以直接返回后方的内容作为运算结果,反之相反
## Ⅳ - 应用场景举例
>##### 转换成数组时根据特定条件去重
>
>```js
>let andObj = {}
>let orObj = {}
>let arr = ['努力学习的汪','努力学习的汪','hongjilin','努力学习的汪']
>//使用&& 运算符
>arr.map((item,index)=>{
> !andObj[item] && (andObj[item]=index) //当此属性名第一次出现时,赋予obj
>})
>//使用 || 运算符,其实判断就恰好与&&相反
>arr.map((item,index)=>{
> andObj[item] || (andObj[item]=index) //当此属性名第一次出现时,赋予obj
>})
>console.log(andObj) // {努力学习的汪: 1, hongjilin: 2}
>console.log(orObj) // {努力学习的汪: 1, hongjilin: 2}
>```
>
>这里只是举个偏例,实际上可以变换成很多适用场景
# 二、运算优先级
## Ⅰ- 以题入手
> 此部分我觉得仍是从各种题目入手,通过分析题目对此部分知识点进行梳理整合
>
> 如果要看更多JS面试题目可以点这里 --> **[JavaScript专项练习](https://gitee.com/hongjilin/hongs-study-notes/tree/master/面试_面试题整理/JavaScript专项练习)**
### 1、求下方打印结果
>```js
>var a = 18;
>var b = "努力学习的汪";
>var c = false;
>var d = a && b || c ? c || b ? a : c && b : a ;
>console.log(d)
>```
>
>##### 知识点梳理以及答案解析
>
>1. **&& 运算符的优先级高于 ||,而 || 的优先级又高于?** :
> - 所以我们对它进行第一次分解:**`((a && b) || c) ? (c || b) ? a : (c && b) : a`**
>2. **? : 是右关联**
> - 例如: a ? b : c ? d : e --> a ? b : (c ? d : e)
> - 所以进一步对上方进行分解 : **`((a && b) || c) ? ((c || b) ? a : (c && b)) : a`**
>3. **对于&&来说,如果条件判断结果为true就会返回第二个操作数的值,如果为false就会返回第一个操作数的值**
> - 此知识点在本人笔记 [一、JS中的逻辑或 || 、逻辑与 &&](#**一、JS中的逻辑或 || 、逻辑与 && **) 部分已经给出了详细解释
> - 所以对上方式子进行初步运算后可以得出: **`c ? ((c || b) ? a : c) : a`**
>4. **对于 || 来说,如果条件判断结果为true就会返回第一个操作数的值,如果为false就会返回第二个操作数的值;**
> - 此知识点在本人笔记 [一、JS中的逻辑或 || 、逻辑与 &&](#**一、JS中的逻辑或 || 、逻辑与 && **) 部分已经给出了详细解释
> - 所以对上方式子进行初步运算后可以得出: **`c ? (b ? a : c) : a`**
>5. 此时结果就非常明了了,下面给出结果变化
> - **`c ? (b ? a : c) : a`** ==> false ? ( "努力学习的汪" ? 18 : false) : 18
> - 经过隐式转换后 : **false ? (true ? 18: false) : 18**
> - 三元运算符可知,当**?**前为**false**,返回**:**后方的值 所以结果为`18`
点赞
回复
X