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 相关文章推荐
基于jquery的内容循环滚动小模块(仿新浪微博未登录首页滚动微博显示)
Mar 28 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
Dec 05 Javascript
Visual Studio中js调试的方法图解
Jun 30 Javascript
firefox浏览器用jquery.uploadify插件上传时报HTTP 302错误
Mar 01 Javascript
JSON 对象未定义错误的解决方法
Sep 29 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
Oct 14 Javascript
详解JavaScript中的属性和特性
Dec 08 Javascript
AngularJS实践之使用ng-repeat中$index的注意点
Dec 22 Javascript
vue.js配合$.post从后台获取数据简单demo分享
Aug 11 Javascript
深入理解 Koa 框架中间件原理
Oct 18 Javascript
JS实现图片切换效果
Nov 17 Javascript
Layui弹出层 加载 做编辑页面的方法
Sep 16 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
简单的cookie计数器实现源码
2013/06/07 PHP
php unset全局变量运用问题的深入解析
2013/06/17 PHP
解析crontab php自动运行的方法
2013/06/24 PHP
解析将多维数组转换为支持curl提交的一维数组格式
2013/07/08 PHP
php利用header函数下载各种文件
2016/08/24 PHP
PHP的CURL方法curl_setopt()函数案例介绍(抓取网页,POST数据)
2016/12/14 PHP
PHP中str_split()函数的用法讲解
2019/04/11 PHP
Thinkphp5框架实现获取数据库数据到视图的方法
2019/08/14 PHP
jquery中EasyUI实现同步树
2015/03/01 Javascript
js实现简单秒表走动的时钟特效
2020/03/25 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
Vue下的国际化处理方法
2017/12/18 Javascript
如何在 JavaScript 中更好地利用数组
2018/09/27 Javascript
如何在JavaScript中优雅的提取循环内数据详解
2019/03/04 Javascript
原生JS生成指定位数的验证码
2020/10/28 Javascript
[01:31](回顾)杀出重围,决战TI之巅
2014/07/01 DOTA
Python的多态性实例分析
2015/07/07 Python
windows系统下Python环境搭建教程
2017/03/28 Python
详解python多线程、锁、event事件机制的简单使用
2018/04/27 Python
Python使用matplotlib模块绘制图像并设置标题与坐标轴等信息示例
2018/05/04 Python
python爬虫基础教程:requests库(二)代码实例
2019/04/09 Python
python 字符串追加实例
2019/07/20 Python
详解一种用django_cache实现分布式锁的方式
2019/09/01 Python
python绘制无向图度分布曲线示例
2019/11/22 Python
python写一个随机点名软件的实例
2019/11/28 Python
Python二维数组实现求出3*3矩阵对角线元素的和示例
2019/11/29 Python
浅谈Keras中shuffle和validation_split的顺序
2020/06/19 Python
Charles&Keith美国官方网站:新加坡快时尚鞋类和配饰零售商
2019/11/27 全球购物
解释下列WebService名词:WSDL、SOAP、UDDI
2012/06/22 面试题
五一劳动节活动记录
2014/03/23 职场文书
年终晚会活动方案
2014/08/21 职场文书
领导班子整改措施
2014/10/24 职场文书
内乡县衙导游词
2015/02/05 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
升职感谢领导的话语及升职感谢信
2019/06/24 职场文书
导游词之云南省玉龙雪山
2019/12/19 职场文书