Javascript中3个需要注意的运算符


Posted in Javascript onApril 02, 2015

平时写惯了C#,所以会觉得什么样的运算符就应该做什么样的运算,但是有一天你的习惯被其他语言颠覆了,不知道是不是有一股强大的好奇

心,刚好在js中,我的这种习惯就被颠覆了,下面就看看哪些运算符颠覆了我的三观。

一:==运算符

==运算符之所以可以颠覆,可以从下面几个例子中看出来。

<1> "10"==10 ?

如果这要是放在C#里面,编译器会毫不客气的告诉你,王八羔子,类型都不同,你比个毛线啊。。。但是在JS里面又会是怎样呢?

Javascript中3个需要注意的运算符

从上图中,你可以看到,不管你好奇不好奇,答案就在那里,可能有人就要问,到底是10转化成了“10”,还是“10”被转化成了10,所以这个也

是我一直吐槽的地方,如果是C#,你还可以看看IL里面到底怎么处理的,而JS里面你什么都看不到,只能听教科书上的一面之词,无法眼见为实。

所以除了记住就是记住了,我只能说是字符串”10“转换成了10,然后进行整形比较的。

<2>true==1 ?

这个问题稍微想想还能理解,其实在C#的IL中,也是将true和false相应的转化为1和0,所以js在判断时会将true转化为1,再进行整形比较,这

个现象我觉得不怎么稀奇,记住就好。

Javascript中3个需要注意的运算符 

<3> {valueOf:function(){return "10"}}==10?

这个问题也是蛮奇葩的,对象居然还可以和int类型相比较?但是在JS中却真的可以做到,原理是这样的,如果一个对象和int/string比较的话,

js内部会优先调用valueOf方法,也就是将对象数值化,其实这里好玩的地方就是我们自定义的valueOf重写了父类的valueOf方法,所以上面

的例子就是判断“10”==10?。

Javascript中3个需要注意的运算符

这里还要PS一下,如果你的类中没有定义valueOf方法的话,js内部引擎还会再去找toString()方法,如果有则执行。

Javascript中3个需要注意的运算符

不知道当你接触到这些新用法的时候,是不是觉得有点慌乱,好像有种乱七八糟的感觉?如果你很怕程序有潜在的bug,那么为了保险起见,

转化为同一数据类型来比较吧,当然在js里面还有一个===运算符可以说跟C#里面的逻辑运算符算是最接近的,这个多出来的“=”就是在

“==”的基础上再判断类型是否相等?就比如:

Javascript中3个需要注意的运算符

二:&&和||运算符

 这两个运算符也是蛮奇葩的,在我们的思维习惯里面,这两个运算符两边就应该都是bool类型,但是在JS里面这些定义会被彻底颠覆,正是这些新规则,所以我们可以完成很多新花样,比如在jquery的源码中,可以到处都能找到这样的痕迹。

Javascript中3个需要注意的运算符

从图中我们看到了这么一句,bup=b && b.parentNode,你能理解这句话的意思吗?其实它的意思是先判断b是否存在,如果b不存在,那

可能b就是undefined,null,0 或者NaN,如果b存在,那么就返回m.parentNode,就这么好玩,如果你用C#的话,就少不了几个if条件了,

也算是简化代码吧,然后再看看||操作,这个简直在源码里面可以用泛滥来形容了,不过乍一看,特别像是C#中的可空运算符,所以亲切感倍

增,下面就拿ret=results||[]来说,如果results有值,那么ret=results,如果results为null,undefined,NaN或者0,那么result=[],就

这样的任性,省去了程序员很多if判断,最后要补充一句,其实就像C#的IL中一样,只是JS底层给我们做了if判断。

Javascript中3个需要注意的运算符

Javascript 相关文章推荐
js查找父节点的简单方法
Jun 28 Javascript
有道JavaScript监听浏览器的问题
Jun 23 Javascript
js实现网站首页图片滚动显示
Feb 04 Javascript
使用jquery局部刷新(jquery.load)从数据库取出数据
Jan 22 Javascript
解释&amp;&amp;和||在javascript中的另类用法
Jul 28 Javascript
jQuery实现长按按钮触发事件的方法
Feb 02 Javascript
Jquery+ajax+JAVA(servlet)实现下拉菜单异步取值
Mar 23 Javascript
Express URL跳转(重定向)的实现方法
Apr 07 Javascript
vue.js路由跳转详解
Aug 28 Javascript
vue2.0 如何把子组件的数据传给父组件(推荐)
Jan 15 Javascript
Bootstrap模态对话框用法简单示例
Aug 31 Javascript
小程序指纹验证的实现代码
Dec 04 Javascript
原生JS实现响应式瀑布流布局
Apr 02 #Javascript
Javascript变量的作用域和作用域链详解
Apr 02 #Javascript
JavaScript中连接操作Oracle数据库实例
Apr 02 #Javascript
JavaScript中操作Mysql数据库实例
Apr 02 #Javascript
JavaScript使用ActiveXObject访问Access和SQL Server数据库
Apr 02 #Javascript
JavaScript实现重置表单(reset)的方法
Apr 02 #Javascript
javascript实现百度地图鼠标滑动事件显示、隐藏
Apr 02 #Javascript
You might like
在服务端进行目录建立、删除,文件上传、删除的过程的php代码
2008/09/10 PHP
学习php分页代码实例
2013/10/24 PHP
详解PHP防止直接访问.php 文件的实现方法
2017/07/28 PHP
Jquery 扩展方法
2010/05/06 Javascript
jQuery 网易相册鼠标移动显示隐藏效果实现代码
2013/03/31 Javascript
使用jQuery和Bootstrap实现多层、自适应模态窗口
2014/12/22 Javascript
jQuery+HTML5实现手机摇一摇换衣特效
2015/06/05 Javascript
javascript常用正则表达式汇总
2015/07/31 Javascript
Three.js学习之文字形状及自定义形状
2016/08/01 Javascript
js动态引入的四种方法
2018/05/05 Javascript
elementUI table表格动态合并的示例代码
2019/05/15 Javascript
node 标准输入流和输出流代码实例
2019/09/19 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
2019/10/12 jQuery
vue vant Area组件使用详解
2019/12/09 Javascript
基于vue实现图片验证码倒计时60s功能
2019/12/10 Javascript
vue实现移动端图片上传功能
2019/12/23 Javascript
详解JavaScript中的数据类型,以及检测数据类型的方法
2020/09/17 Javascript
[02:44]重置世界,颠覆未来——DOTA2 7.23版本震撼上线
2019/12/01 DOTA
python使用nntp读取新闻组内容的方法
2015/05/08 Python
浅谈python多线程和队列管理shell程序
2015/08/04 Python
使用py2exe在Windows下将Python程序转为exe文件
2016/03/04 Python
对python中的高效迭代器函数详解
2018/10/18 Python
Python3中urlencode和urldecode的用法详解
2019/07/23 Python
tensorflow 查看梯度方式
2020/02/04 Python
Python flask框架实现查询数据库并显示数据
2020/06/04 Python
使用 CSS3 中@media 实现网页自适应的示例代码
2020/03/24 HTML / CSS
Under Armour西班牙官网:美国知名的高端功能性运动品牌
2018/12/12 全球购物
请解释接口的显式实现有什么意义
2012/05/26 面试题
易程科技软件测试笔试
2013/03/24 面试题
技术合作协议书范本
2014/04/18 职场文书
数据保密承诺书
2014/06/03 职场文书
图书室标语
2014/06/21 职场文书
居委会四风问题个人对照检查材料
2014/09/25 职场文书
临时工聘用合同协议书
2014/10/29 职场文书
电力培训学习心得体会
2016/01/11 职场文书
 Python 中 logging 模块使用详情
2022/03/03 Python