摘要:业务越复杂,逻辑就越复杂,判断就越多比较判断比较判断是比较两个值,返回一个布尔值,表示是否满足比较条件。对于非布尔值的数据,取反运算符会自动将其转为布尔值。
前端学习:教程&开发模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试-前端资源汇总
欢迎提issues斧正:==========
JavaScript-判断代码中,多多少少会有判断语句。业务越复杂,逻辑就越复杂,判断就越多
比较判断比较判断是比较两个值,返回一个布尔值,表示是否满足比较条件。JavaScript一共提供了8个比较运算符,参考我另一篇文章:JavaScript-运算符浅析。
这里主要说一下严格相等运算符和相等运算符的区别:
==相等运算符比较两个值的时候会判断两个值的类型,如果不是同一类型,会强制转换为同一类型进行比较(类型转换参考温故js系列第一篇文章: 类型转换)。
而===比较两个值的时候先判断两个值的类型,如果不是同一类型,直接返回false,值类型相同再进行值的比较。
所以,从性能上来说,==会比===多走一条类型转换的路,稍逊一点。从结果上来说,有时候类型转换会给你带来你不想要的比较结果。 这也就是为什么都推崇使用===的原因。当然,==在合适的业务场景下使用也是必要的。
严格相等运算符===判断 返回 两个值类型不同 false 两个值都是null/undefined/true/false true 两个值其中之一为NaN false 两个值都为数值且值相等 true 两个值都为字符串且值相等 true 两个值都指向同一个引用类型 true 1 === "1" // false true === true // true undefined === undefined // true null === null // true 1 === 1 // true NaN === NaN // false +0 === -0 // true ({} === {}) // false [] === [] // false (function (){} === function (){}) // false var v1 = {}; var v2 = v1; //两个值引用同一个对象 v1 === v2 // true
严格相等运算符有一个对应的严格不相等运算符(!==),两者的运算结果正好相反
相等运算符==规则: if 相等运算符比较相同类型的数据时,同严格相等运算符 else if 相等运算符比较不同类型的数据时: 原始类型的数据会转换成数值类型,把字符串和布尔值都转为数值,再进行比较 null == undefined 返回true 一个是对象,另一个是数字或者字符串,把对象转成基本类型值再比较 else false 123 == 123; //true "123" == 123; //true,"123"会转成成数值123 false == 0; //true,false 转成数值就是0 "a" == "A"; //false,转换后的编码不一样 123 == {}; //false,执行toString()或valueOf()会改变 123 == NaN; //false,只要有NaN,都是false {} == {}; //false,比较的是他们的地址,每个新创建对象的引用地址都不同 null == undefined //true "NaN" == NaN //false 123 == NaN //false NaN == NaN //false false == 0 //true true == 1 //true true == 2 //false undefined == 0 //false null == 0 //false "123" == 123 //true "123" === 123 //false
相等运算符有一个对应的不相等运算符(!=),两者的运算结果正好相反
!!判断!!相当于Boolean,写代码时用!!转化为Boolean类型做判断非常好用
!!"xzavier"; // true !!""; // false !!"0"; // true !!"1"; // true !!"-1" // true !!0 // false !!undefined // false !!null // false !!NaN // false !!{}; // true !!{name:"xz"} // true !![]; // true !![1,2,3]; // true !!true; // true!判断
取反运算符 ! 用于将布尔值变为相反值,即true变成false,false变成true。对于非布尔值的数据,取反运算符会自动将其转为布尔值。规则是,以下六个值取反后为true,其他值取反后都为false
undefined null false 0(包括+0和-0) NaN 空字符串("") !undefined // true !null // true !false // true !0 // true !NaN // true !"" // true !54 // false !"hello" // false ![] // false ![1,2,3] // false !{} // false !{name:"xz"} // false[]和{}判断
对于[]和{},我们在业务代码中肯定会对其做判断,如上
!!{}; // true !!{name:"xz"} // true !![]; // true !![1,2,3]; // true
不能用!!和!做判断,对于数组,我们用它的length属性做判断
[].length // 0 false [1,2,3].length // 3 true
对象的话,可以采用jQuery的方法$.isEmptyObject(obj),也可以js封装一个方法,就模仿jQuery 写一个
function isEmptyObject(obj) { var name; for ( name in obj ) { return false; } return true; } isEmptyObject({}); //true isEmptyObject({name: "xzavier"}); false
推荐一个工具库underscore,它也有个方法isEmpty(object)
const _ = require("underscore"); _.isEmpty({}); // true&&判断
用在条件表达式中,规则是:
num1 && num2 true true true true false false false true false false false false
用在语句中,规则是 :
result = expression1 && expression2
如果expression1的计算结果为false,则result为expression1。否则result为expression2
(1 - 1) && ( x += 1) // 0 (2 > 1) && ( 5 + 5) // 10 (2 + 1) && ( 5 + 5) // 10||判断
用在条件表达式中,规则是:
num1 || num2 true true true true false true false true true false false false
用在语句中,规则是:
如果第一个运算子的布尔值为true,则返回第一个运算子的值,且不再对第二个运算子求值 如果第一个运算子的布尔值为false,则返回第二个运算子的值
||运算符一般在业务代码中做条件表达式判断和容错处理,我们在取数据时取不到的情况下,又不能影响后面的业务代码,就需要进行容错。||就是一个非常好的容错写法,相当于提供一个备用数据。
var data = undefined || backup_data; //请求出错,数据为undefined时,就去备用数据backup_data三目判断
规则:
condition ? expression1 : expression2; function absN(xzavier) { return xzavier > 0 ? xzavier : -xzavier; } absN(-123); //123 absN(123); //123
如果第一个表达式的布尔值为true,则返回第二个表达式的值,否则返回第三个表达式的值。
判断暂时写到这儿,判断是我们代码生涯中时时刻刻接触的,更多的attention在接触研究过会更新于此...
休息一刻,约好要去打篮球了。。。
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/80111.html
摘要:对象创建字面量方式构造函数方式也可以这样不过这样的话,为何不选择字面量方式字面量方式和方式的写法是等价的,返回的结果是同种类的对象。构造函数产生实例时,实例通过其对应原型对象的访问对应的构造函数对象。 前端学习:教程&模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试资源汇总 欢迎提issues斧正:对象&对象使用 Object对象 在 JavaScript 中,对...
本篇文章主要是讲述在JavaScript中判断两个值相等,不要认为很简单,要注意的是在JavaScript中存在4种不同的相等逻辑。 ECMAScript 是 JavaScript 的语言规范,在ECMAScript 规范中存在四种相等算法,如下图所示: 上图中每个依次写下来,很多前端应该熟悉严格相等和非严格相等,但对于同值零和同值却不熟悉,现在就依次下面四种方法。 同值 同值零 非...
摘要:引用数据类型引用数据类型值指保存在堆内存中的对象。访问方式是按引用访问。数据类型检测操作符是检测基本类型的最佳工具。未定义布尔值字符串数值对象或函数用于检测引用类型,可以检测到它是什么类型的实例。 前端学习:教程&开发模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试-前端资源汇总 欢迎提issues斧正:数据类型 回味,无穷! 数据类型定义 数据类型分类 基本数据...
要是别人问您:如何让 x 等于 1 且让 x 等于 2 且让 x 等于 3 的等式成立? 咋地,知道如何实现?想骂人有不 现在我们一起来分解思路: 我们先来讲讲宽松相等== 和严格相等 ===,这两个都能用来判断两个值是否相等,但们明确上文提到的等于指的是哪一种,二者的区别看下: (1) 这两个基础直接的区别: (1.1) 不同类型间比较,== 比较转化成同一类型后的值看值是否相等,...
摘要:稍后我们再详细剖析,接下来先看一个问题。还内建了一些在之前没有暴露给开发者的,它们代表了内部语言行为。使用,可能有不少朋友一开始就想到这种方式,简单贴一下阅读更多 在 JavaScript 环境下,可以让表达式 a == true && a == false 为 true 吗? 就像下面这样,可以在控制台打印出 ’yeah: // code here if (a == true && ...
阅读 2845·2023-04-25 19:08
阅读 1397·2021-11-16 11:45
阅读 1912·2021-10-13 09:40
阅读 3930·2021-09-30 09:47
阅读 2393·2019-08-30 15:44
阅读 2204·2019-08-30 13:03
阅读 1348·2019-08-30 12:56
阅读 1867·2019-08-26 14:04