JavaScript中“+”的陷阱深刻理解


Posted in Javascript onDecember 04, 2012

一、两个中括号相加
[] + []
中括号没有语句块的作用,因此这里的两个中括号就是一个数组。两个数组(对象类型)相加先要将其转换成值类型(基本类型)。
1,转成值类型调用valueOf,[]的valueOf()还是自己

var arr = []; 
arr.valueOf() === arr; // true

2,转成字符串,[]的toString是空字符串
[].toString(); // "" 
String([]) // ""

结果出来了。两个空字符串相加,结果仍然是空字符串。即这里的“+”指字符串连接而非数字相加。

二、大括号和中括号的相加

{} + []

注意这里的大括号仍然不是对象直接量,而是空语句块。因此可以去掉它,即相当于
+ []

注意,这时由之前看似的两个运算数变成了实际的单运算数。而“+”运算符当只有一个运算数时只代表一个意思:算术加运算。即这里没有字符串连接的意思了。
中括号的toString()是空字符串,又相当于
+ ""

“+”代表算术加运算,字符串非数字,因此将其转换成数字类型。空字符串转成数字类型在上一篇提到过,为0。
那么最后的结果就是0。

三、中括号和大括号相加

[] + {}

与上面的对比,只是中括号和小括号交换了顺序。结果却不相同。大括号放到右边后,与上面讨论的大括号的意义不同了。这里的大括号就是一个对象直接量而非语句块。
“+” 两边的运算数转成值类型分别是:"" 和 "[object Object]"。这时 "+" 表示字符串连接。即
"" + "[object Object]"

结果是 “[object Object]”。

四、小括号也和它们相加试试
突发奇想!好吧,小括号虽然有多义性,但它不能作为运算数。

Javascript 相关文章推荐
Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式
Jun 24 Javascript
JavaScript制作简易的微信打飞机
Mar 31 Javascript
jquery中添加属性和删除属性
Jun 03 Javascript
jQuery三级下拉列表导航菜单代码分享
Apr 15 Javascript
详解javascript函数的参数
Nov 10 Javascript
jQuery与JS加载事件用法分析
Sep 04 Javascript
jQuery读取XML文件的方法示例
Feb 03 Javascript
angular写一个列表的选择全选交互组件的示例
Jan 22 Javascript
JS获取input[file]的值并显示在页面的实现方法
Mar 09 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
Jul 26 Javascript
vue js秒转天数小时分钟秒的实例代码
Aug 08 Javascript
微信小程序 this.triggerEvent()的具体使用
Dec 10 Javascript
将光标定位于输入框最右侧实现代码
Dec 04 #Javascript
JavaScript中__proto__与prototype的关系深入理解
Dec 04 #Javascript
js 限制数字 js限制输入实现代码
Dec 04 #Javascript
JSON语法五大要素图文介绍
Dec 04 #Javascript
js关闭子窗体刷新父窗体实现方法
Dec 04 #Javascript
cument.execCommand()用法深入理解
Dec 04 #Javascript
页面只能打开一次Cooike如何实现
Dec 04 #Javascript
You might like
将文件夹压缩成zip文件的php代码
2009/12/14 PHP
使用Curl进行抓取远程内容时url中文编码问题示例探讨
2013/10/29 PHP
php 判断服务器操作系统的类型
2014/02/17 PHP
Zend Framework动作助手Redirector用法实例详解
2016/03/05 PHP
js prototype 格式化数字 By shawl.qiu
2007/04/02 Javascript
javascript 动态生成私有变量访问器
2009/12/06 Javascript
Javascript 类与静态类的实现(续)
2010/04/02 Javascript
jQuery EasyUI API 中文文档 - TimeSpinner时间微调器
2011/10/23 Javascript
javascript中数组的concat()方法使用介绍
2013/12/18 Javascript
javascript强制点击广告的方法
2015/02/06 Javascript
jQuery实现按键盘方向键翻页特效
2015/03/18 Javascript
无刷新上传文件并返回自定义值
2015/06/11 Javascript
jQuery原型属性和原型方法详解
2015/07/07 Javascript
jQuery实现图片向左向右切换效果的简单实例
2016/05/18 Javascript
jQuery中的AjaxSubmit使用讲解
2016/09/25 Javascript
vue.js指令v-for使用及索引获取
2016/11/03 Javascript
JS匿名函数实例分析
2016/11/26 Javascript
对Angular中单向数据流的深入理解
2018/03/31 Javascript
Vue模拟数据,实现路由进入商品详情页面的示例
2018/08/31 Javascript
vue.js高德地图实现热点图代码实例
2019/04/18 Javascript
JavaScript日期库date-fn.js使用方法解析
2020/09/09 Javascript
antd日期选择器禁止选择当天之前的时间操作
2020/10/29 Javascript
Python脚本实现格式化css文件
2015/04/08 Python
python单例模式实例分析
2015/04/08 Python
Python错误: SyntaxError: Non-ASCII character解决办法
2017/06/08 Python
Python实现统计给定字符串中重复模式最高子串功能示例
2018/05/16 Python
利用django-suit模板添加自定义的菜单、页面及设置访问权限
2018/07/13 Python
python实现桌面托盘气泡提示
2019/07/29 Python
python3连接mysql获取ansible动态inventory脚本
2020/01/19 Python
使用jupyter notebook将文件保存为Markdown,HTML等文件格式
2020/04/14 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
美国卡车、吉普车和SUV零件网站:4 Wheel Parts
2016/11/24 全球购物
建筑人员岗位职责
2013/12/25 职场文书
保护环境倡议书
2014/04/14 职场文书
综合管理员岗位职责
2015/02/11 职场文书
css position fixed 左右双定位的实现代码
2021/04/29 HTML / CSS