Javascript的比较汇总


Posted in Javascript onJuly 25, 2016

在Javascript应用过程中会遇到各式各样的比较,今天给大家整理了三种情况,一起来学习下。

1.两个对象的比较

Javascript的比较中参杂了一些比较奇怪的特性,我们来看一些比较简单的比较。

// 原始值的比较
> var a = 12
undefined
> var b = 12
undefined
> a == b
true
> a === b
true
// 对象的比较
> var c = []
undefined
> var d = []
undefined
> c == d
false
> c === d
false

由上面的结果可以看出比较两个原始值跟比较对象规则似乎有点不同,比较两个对象值的话即便它们的值相同,但是最后的结果是不一样的。比较两个对象,应该比较的是两个对象的引用。

如果我们这样操作:

> var m = {}
undefined
> n = m
{}
> n === m
true

表示两个变量都指向同一个对象,所以它们就是相同的了。

2.不同类型的比较

还有下面这个比较特殊的情况

> 12 == "12"
true

> null == undefined
true
> undefined == false
false
> null == false
false
> null === undefined
false

为什么整型能够等于字符串?这是由于==(等于而非全等)并不比较类型,它比较之前会将需要比较的值进行类型转换,这里的话会将字符串转换成数值类型然后进行比较。为什么这么肯定? 我们做一下实验。

> 1 + 2
3
> 1 + "2"
'12'
> 2 < "12"
true
> "2" < "12"
false

从上面例子可以看出,数值2确实是比字符串12小的。如果比较之前是数值转换成字符串那结果应该是"2" > "12"才对。
还不相信?我再举个例子。

> "12d" > 12
false
> "12d" < 12
false
> "12d" == 12
false
> "12" < "12d"
true

这是为什么呢?如果是将12转换成字符串的话,那12d应该是大于12才对吧。为什么怎么比较都是false?我估计是由于下面这个特殊的家伙。

> NaN < 1
false
> NaN > 1
false

NaN无论跟什么进行比较,都会返回false。包括它自己。所以要判断一个变量是不是NaN最好的办法就是x != x如果返回的是true则表明x是NaN。那么这里应该就是当12d要转换成数值类型的时候由于带有特殊的字符,最后变成了NaN了,跟数值类型无论怎么比较结果都是false。

对于数字与字符串操作符来说,加号运算符跟比较运算符的行为有所不同。加号运算符更偏爱字符串,如果其中一个操作数是字符串的话则会转换成字符串。而比较运算符则比较偏爱数字,只有在两个数字都为字符串的时候才会进行字符串比较。
至于上面的null 跟 undefined。。。。。我暂时也不知道怎么解释它们的行为。我也只能姑且记住。因为它们比较特殊。

3.对象跟原始值的比较

如果两个需要比较的对象一个是javascript对象一个是字符串,则会进行某种程度上的类型转换。想办法把对象的值转换成原始值。一般来说就有valueOf, toString两种方法。下面是一个空对象的转换流程:

// 我直接明文写出来了
> a = {}
{}
// 1. valueOf 转换
> a.valueOf()
{}

// 2. 如果上面操作得到的不是一个原始值则进而用toString 转换。(反之亦然)
> a.toString()
'[object Object]'
> a == '[object Object]'
true

上面其实是一个内置对象的转换过程,也是javascript的机制。首先它会调用valueOf进行转换,如果得到的值并不是一个原始值,则会进而调用toString进行转换,最后得到的值是'[object Object]'一个很奇怪的值,不过它是原始值。如果把变量a跟这个值做相等判断(不是全等)则可以得出一个true的结果。(是不是被它搞崩溃了?)

然而权威指南给了如下原则,我们可以参考一下。

原始值的转换JavaScript语言核心内置类首先尝试使用ValueOf转换,然后使用toString进行转换。除了日期类,它只使用toString进行转换。那些不是JavaScript核心中的对象则通过各自的实现中定义的方式来转换为原始值。
根据上面的解释。我们的a={}与原始值进行比较的时候,会先调用valueOf函数,它的结果是{}显然不是一个原始值。则会使用toString进行转换。最后得出了那个很奇怪的结果。不过这个很奇怪的结果'[object Object]'确实是 {}的原始值。(它是字符串的字面量)。

以上就是Javascript中的比较汇总,希望本文所述对大家学习javascript时有所帮助。

Javascript 相关文章推荐
JQuery入门——事件切换之hover()方法应用介绍
Feb 05 Javascript
jquery实现图片等比例缩放以及max-width在ie中不兼容解决
Mar 21 Javascript
javascript:void(0)的作用示例介绍
Oct 28 Javascript
基于JS2Image实现圣诞树代码
Dec 24 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
Nov 02 Javascript
JS条形码(一维码)插件JsBarcode用法详解【编码类型、参数、属性】
Apr 19 Javascript
JS验证全角与半角及相互转化的介绍
May 18 Javascript
完美解决iview 的select下拉框选项错位的问题
Mar 02 Javascript
JS实现的合并两个有序链表算法示例
Feb 25 Javascript
javascript实现画板功能
Apr 12 Javascript
Element Card 卡片的具体使用
Jul 26 Javascript
Node.js web 应用如何封装到Docker容器中
Sep 01 Javascript
[原创]jQuery常用的4种加载方式分析
Jul 25 #Javascript
JS仿百度自动下拉框模糊匹配提示
Jul 25 #Javascript
JS本地刷新返回上一页代码
Jul 25 #Javascript
jQuery layui常用方法介绍
Jul 25 #Javascript
Bootstrap Validator 表单验证
Jul 25 #Javascript
javascript封装addLoadEvent实现页面同时加载执行多个函数的方法
Jul 25 #Javascript
最简单纯JavaScript实现Tab标签页切换的方式(推荐)
Jul 25 #Javascript
You might like
十天学会php之第四天
2006/10/09 PHP
慎用preg_replace危险的/e修饰符(一句话后门常用)
2013/06/19 PHP
Nginx下配置codeigniter框架方法
2015/04/07 PHP
Thinkphp3.2.3分页使用实例解析
2016/07/28 PHP
jQuery 注意事项 与原因分析
2009/04/24 Javascript
js 验证身份证信息有效性
2014/03/28 Javascript
jquery实现仿新浪微博带动画效果弹出层代码(可关闭、可拖动)
2015/10/12 Javascript
使用基于Node.js的构建工具Grunt来发布ASP.NET MVC项目
2016/02/15 Javascript
JavaScript中对JSON对象的基本操作示例
2016/05/21 Javascript
JS获取地址栏参数的两种方法(简单实用)
2016/06/14 Javascript
js实现小窗口拖拽效果
2016/12/03 Javascript
nodejs获取微信小程序带参数二维码实现代码
2017/04/12 NodeJs
详解vue项目打包后通过百度的BAE发布到网上的流程
2018/03/05 Javascript
利用百度echarts实现图表功能简单入门示例【附源码下载】
2019/06/10 Javascript
JS实现的简单tab切换功能完整示例
2019/06/20 Javascript
Python基于pygame实现图片代替鼠标移动效果
2015/11/11 Python
python编程开发之类型转换convert实例分析
2015/11/13 Python
Python标准模块--ContextManager上下文管理器的具体用法
2017/11/27 Python
pyqt5实现按钮添加背景图片以及背景图片的切换方法
2019/06/13 Python
解决Django中调用keras的模型出现的问题
2019/08/07 Python
python 中不同包 类 方法 之间的调用详解
2020/03/09 Python
基于python实现百度语音识别和图灵对话
2020/11/02 Python
a标签下载链接的简单实现
2016/09/13 HTML / CSS
HTML5 播放 RTSP 视频的实例代码
2019/07/29 HTML / CSS
阿拉伯世界最大的电子商务网站:Souq沙特阿拉伯
2016/10/28 全球购物
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
Deux par Deux官方网站:设计师童装
2020/01/03 全球购物
党的群众路线教育实践活动批评与自我批评
2014/02/16 职场文书
村抢险救灾方案
2014/05/09 职场文书
小学捐书活动总结
2014/07/05 职场文书
股指期货心得体会
2014/09/13 职场文书
群众路线领导干部个人对照检查材料(集锦)
2014/09/23 职场文书
幼儿教师师德师风自我评价
2015/03/05 职场文书
新闻稿怎么写
2015/07/18 职场文书
人生一定要学会的三样东西:放下、忘记、珍惜
2019/08/21 职场文书
SQL Server数据库备份和恢复数据库的全过程
2022/06/14 SQL Server