在 stackoverflow 上有人提问:arrays - Why does [1,2] + [3,4] = "1,23,4" in JavaScript?
问题
我想将一个数组追加到另一个数组的后面,于是我在 firebug 编写如下代码:
[1,2] + [3,4]
但是,出乎意料,它却输出了:
"1,23,4"
而没有输出我期望的:
[1,2,3,4]
这是怎么回事呢?为什么 [1,2] + [3,4]
不等于 [1,2,3,4]
?
类似问题还有:为什么 ++[[]][+[]]+[+[]] = 10?
解答
JavaScript 的 +
运算符有两个目的:
-
将两个数相加;
-
将两个字符串连接。
规范并没有定义 +
运算符在数组上的行为,所以javascript 首先 把数组转换成字符串,然后在字符串上进行 +
运算。
如果想连接两个数组,可以使用数组的 concat
方法:
[1, 2].concat([3, 4]) // [1, 2, 3, 4]
javascript 中的 + 运算符概述
下面简单介绍一下 +
运算符,有兴趣的话可以看看我以前写的 代码之谜(三)- 运算符。
JavaScript 具有 6 种内置 数据类型: (译注:从给出的连接看,原作者的意思应该是 原始类型系统 的数据类型,JavaScript 事实上有两套类型系统。 第一套类型系统是用 typeof
来识别,称之为原始(primitive)类型系统,而第二套类型系统是以它为基础,从 object
这一种类型中发展起来的,即对象类型系统,对象类型系统用instanceof
来识别。@justjavac)
-
undefined
-
boolean
-
number
-
string
-
function
-
object
需要注意的是,null
和 []
是两个截然不同的类型,当使用 typeof
运算时,它们却都返回 object
。 但是在使用 +
运算符时,在这两种情况下的工作方式是不同的。
在JavaScript 中,数组不是基本类型,它的存在仅仅是一个糖衣语法,它其实是 Array
类的实例。(ps:function
其实也是 Function
类实例的糖衣语法。)
如果说道现在你脑子还是清醒的,是时候加点儿猛料了。javascript 的对象包装器类型例如 new Number(5)
, new Boolean(true)
和 new String("abc")
也都是 object
类型,它们不是数字,布尔,字符串。然而,对于算数运算符 Number
和 Boolean
表现的为数字。
还记得我前面说过的 +
运算符吗?它的操作对象是 数字和字符串,也就是 Number
,Boolean
,String
或者number
,boolean
,string
。
下面的表格就是 +
运算符对于不同类型进行运算后,得到的结果类型
----------------------------------------------------------------------------------------
| undefined | boolean | number | string | function | object | null | array
----------------------------------------------------------------------------------------
undefined | number | number | number | string | string | string | number | string
boolean | number | number | number | string | string | string | number | string
number | number | number | number | string | string | string | number | string
string | string | string | string | string | string | string | string | string
function | string | string | string | string | string | string | string | string
object | string | string | string | string | string | string | string | string
null | number | number | number | string | string | string | number | string
array | string | string | string | string | string | string | string | string
-------------------------------------------------------------------------------------------
本表适用于 Chrome 13, Firefox 6, Opera 11 and IE9。课外作业:检查其他的浏览器兼容性。
注意:用户自定义对象进行 + 运算不一定总产生一个字符串结果。这主要取决于 对象类型到原生类型转换 的实现方式。
例如:
var o = {
valueOf : function () { return 4; }
};
计算 o + 2
将得到 6, 是一个数字 number;计算 o + '2'
得到 '42', 是一个字符串 string。
继续阅读:写了10年Javascript未必全了解的连续赋值运算
分享到:
相关推荐
编一个程序,用while循环语句来计算1+1/2+2/3+3/4+...+99/100之和。
6.6 在脚本中修改显示样式 195 6.7 本章小结 197 第7章 字体与文本相关属性 198 7.1 字体相关属性 199 7.2 CSS 3支持的颜色表示方法 205 7.3 文本相关属性 206 7.4 CSS 3新增的服务器字体 212 7.5 本章小结 ...
web 相关的chm文档,html5+html4+javascript+jquery+php+css2.0+css3.0
1、资源内容:基于HTML+CSS+JavaScript+Vue3+element+MySQL实现工资管理系统(源码+sql).rar 2、适用人群:计算机,电子信息工程、数学等专业的学习者,作为“参考资料”参考学习使用。 3、解压说明:本资源需要...
重点介绍如何使用DlV+CSS3进行网页布局,注重实战操作,使读者在学习CSS3技术的同时,掌握DIV+CSS3的精髓。还介绍了一些扩展知识,包括CSS3与JavaScript、XML等综台应用。最后给出5个综合实例,使读者进一步巩固所学...
1、css中文使用手册.chm 2、html和css网页标准指南.chm 3、html中文使用手册.chm 4、javascript参考手册.chm 5、JavaScript参考手册中文版.chm 6、Javascript高级教程.CHM 7、JavaScript使用手册.chm 8、网页...
1、100个直接可以拿来用的JavaScript实用功能代码片段 2、JavaScript DOM编程艺术(中文) 3、JavaScript高级程序设计(第3版)中文 高清 完整 4、JavaScript脚本特效编程给力起飞 5、JavaScript权威指南(第6版)...
绝对实用^内容丰富,全面!第1章 JSP使用基础 第2章 HTML与CSS第3章 JavaScript脚本编程 第4章 JSP编程基础……
目录 一,JS对象二,DOM–1,作用–2,测试三,Jquery–1,概述–2,使用步骤–3,入门案例–4,jQuery的文档就绪四,JQuery的语法–1,选择器–2,常用函数–3,常用事件–4,练习总结 一,JS对象 二,DOM –1,...
【资源说明】 前端学习笔记网站(HTML5+CSS3+JavaScript前端网页web...4、如果基础还行,可以在此代码基础上进行修改,以实现其他功能,也可直接用于毕设、课设、作业等。 欢迎下载,沟通交流,互相学习,共同进步!
1_3.htm JavaScript中的强制类型转换。 1_4.htm 在HTML中为JavaScript传递变量。 1_5.htm 在HTML中引用JavaScript的变量。 1_6.htm 比较undefined和"undefined"。 第2章(\2) 示例描述:客户端的流程控制。 2_1....
JavaScript 中的数字类型指整数和浮点数,不刻意区分二者。 JavaScript 还支持16进制的整数,在所要表示的16进制数前面加上 0x 或者 0X 即可,如 0x1f 表示整数31。 对于较大或较小的数,JavaScript 还支持科学...
1、css中文使用手册.chm 2、html和css网页标准指南.chm 3、html中文使用手册.chm 4、javascript参考手册.chm 5、JavaScript参考手册中文版.chm 6、Javascript高级教程.CHM 7、JavaScript使用手册.chm 8、网页制作...
3、商城系统应能满足消费者在线购买,消费者可以在个人中心进行订单管理,还能申请售后,充分维护了消费者的权益。达到界面美观大方、操作简单、购物方便、系统稳定安全、数据计算准确等要求。 4、商城系统采用原型...
项目介绍 本项目包含管理员与用户两种角色; 管理员角色包含以下功能: ...1. 使用Navicat或者其它工具,在mysql中创建对应名称的数据库,并导入项目的sql文件; 2. 使用IDEA/Eclipse/MyEclipse导入项目,Eclipse/My
1.4 JavaScript及其在Web页面中的位置 3 1.5 Ajax是什么 5 1.6 JavaScript是什么样子的 6 1.7 JavaScript及其在Web开发中承担的角色 7 1.8 JavaScript和事件 9 1.9 标准化JavaScript和W3C 11 1.9.1 ...
第1课 - JavaScript背景知识-[精通JavaScript+jQuery] 第2课 - JavaScript基础 - [精通JavaScript+jQuery] 第3课 - CSS基础 - [精通JavaScript+jQuery] 第4课 - CSS进阶 - [精通JavaScript+jQuery] 第5课 - DOM...
本视频主打内容最全最新,...在position的值什么时候可以触发? …… 三.JS高频面试题 1.介绍JS有哪些内置对象? 2.如何最小化重绘(repaint)和回流(reflow)?3.Javascript作用域链? 4.数据请求 5.跨域和同源策略6.面向对象
项目介绍 本项目分为管理员与医生两种角色; 管理员角色包含以下...1. 使用Navicat或者其它工具,在mysql中创建对应名称的数据库,并导入项目的sql文件; 2. 使用IDEA/Eclipse/MyEclipse导入项目,Eclipse/MyEclips
2-1 JavaScript要写在网页原始代码的哪里? 2-2 Javascnpt的版本 2-3 Javascnpt的写作格式 2-4 引用一个js文件 2-5 网页编辑软件EditPlusZ 第二部分 JavaScript特效集锦 第3章 JavaScript特效集锦 3-1 网页动画 3-2 ...