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 中 document.createEvent的用法
Aug 29 Javascript
JS下拉框内容左右移动效果的具体实现
Jul 10 Javascript
js弹出div并显示遮罩层
Feb 12 Javascript
Jquery效果大全之制作电脑健康体检得分特效附源码下载
Nov 02 Javascript
vue组件中点击按钮后修改输入框的状态实例代码
Apr 14 Javascript
VUE中的无限循环代码解析
Sep 22 Javascript
Vue.js组件间通信方式总结【推荐】
Nov 23 Javascript
Vue框架下引入ActiveX控件的问题解决
Mar 25 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
Jul 26 jQuery
js模拟F11页面全屏显示
Sep 17 Javascript
微信小程序以ssm做后台开发的实现示例
Apr 08 Javascript
vue表单验证之禁止input输入框输入空格
Dec 03 Vue.js
原生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
yii2.0使用Plupload实现带缩放功能的多图上传
2015/12/22 PHP
linux平台编译安装PHP7并安装Redis扩展与Swoole扩展实例教程
2016/09/30 PHP
PHP 根据key 给二维数组分组
2016/12/09 PHP
php封装的验证码类分享
2017/02/26 PHP
PHP编程实现计算抽奖概率算法完整实例
2017/08/09 PHP
用jQuery实现检测浏览器及版本的脚本代码
2008/01/22 Javascript
js数组的操作详解
2013/03/27 Javascript
JavaScript实现向右伸出的多级网页菜单效果
2015/08/25 Javascript
javascript中for/in循环及使用技巧
2015/09/01 Javascript
js 动态生成json对象、时时更新json对象的方法
2016/12/02 Javascript
JS 学习总结之正则表达式的懒惰性和贪婪性
2017/07/03 Javascript
nodejs+mongodb aggregate级联查询操作示例
2018/03/17 NodeJs
select2 ajax 设置默认值,初始值的方法
2018/08/09 Javascript
Python OpenCV获取视频的方法
2018/02/28 Python
python3将视频流保存为本地视频文件
2018/06/20 Python
对Python中内置异常层次结构详解
2018/10/18 Python
python使用百度文字识别功能方法详解
2019/07/23 Python
pytorch 更改预训练模型网络结构的方法
2019/08/19 Python
Python 3.8正式发布重要新功能一览
2019/10/17 Python
Python IDE环境之 新版Pycharm安装详细教程
2020/03/05 Python
python 使用while循环输出*组成的菱形实例
2020/04/12 Python
python如何更新包
2020/06/11 Python
python和JavaScript哪个容易上手
2020/06/23 Python
Python列表的深复制和浅复制示例详解
2021/02/12 Python
多视角3D逼真HTML5水波动画
2016/03/03 HTML / CSS
精灵市场:Pixie Market
2019/06/18 全球购物
机械专业应届生求职信
2013/09/21 职场文书
工程造价管理专业大专生求职信
2013/10/06 职场文书
单位人事专员介绍信
2014/01/11 职场文书
护士求职信
2014/07/05 职场文书
父亲婚礼答谢词
2015/01/04 职场文书
政协工作总结2015
2015/05/20 职场文书
初中班主任培训心得体会
2016/01/07 职场文书
《詹天佑》教学反思
2016/02/20 职场文书
Qt自定义Plot实现曲线绘制的详细过程
2021/11/02 Python
CSS巧用渐变实现高级感背景光动画
2021/12/06 HTML / CSS