在 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未必全了解的连续赋值运算
分享到:
相关推荐
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 本章小结 ...
3. `test(1,2)`和`test(1,2,3,4)`的`t1`和`t2`长度及元素是什么? - `test`函数根据参数长度填充数组,`t1`和`t2`的长度分别为2和4,元素由传入的参数决定。 答案: `t1`的长度是2,元素为[1, 2] `t2`的长度是4...
HTML5、CSS3和JavaScript是现代网页开发的三大核心技术,它们各自扮演着不可或缺的角色。HTML5作为最新的超文本标记语言标准,极大地提升了网页内容的结构化和交互性;CSS3则为网页设计提供了丰富的样式控制和动画...
在"疯狂HTML 5CSS 3JavaScript讲义光盘代码"中,可能包含了一系列教程章节,涵盖了这些技术的基础到进阶内容,比如: 1. HTML5的新元素和API:讲解如何使用新的语义元素,以及如何利用Canvas、Web Storage、Web ...
2. CSS3的基本选择器、布局模型和动画效果:掌握如何定义样式,实现响应式布局,以及创建动态效果。 3. JavaScript基础:了解变量、数据类型、控制流程、函数等概念,以及DOM操作和事件处理。 4. JavaScript进阶:...
重点介绍如何使用DlV+CSS3进行网页布局,注重实战操作,使读者在学习CSS3技术的同时,掌握DIV+CSS3的精髓。还介绍了一些扩展知识,包括CSS3与JavaScript、XML等综台应用。最后给出5个综合实例,使读者进一步巩固所学...
2. AJAX:异步JavaScript和XML,允许页面在不刷新的情况下与服务器交换数据。 3. ES6新特性:如let/const、模板字符串、箭头函数、Promise等,提高了代码质量和可读性。 4. 类和模块:ES6引入了类的概念,以及通过...
1、css中文使用手册.chm 2、html和css网页标准指南.chm 3、html中文使用手册.chm 4、javascript参考手册.chm 5、JavaScript参考手册中文版.chm 6、Javascript高级教程.CHM 7、JavaScript使用手册.chm 8、网页...
在本项目实例中,我们将深入探讨JavaScript与HTML的结合应用,通过实际的项目来学习和理解这两门核心技术。JavaScript作为Web开发中的动态脚本语言,主要用于网页交互和增强用户体验,而HTML则是构建网页结构的基础...
3. **JavaScript**:JavaScript是一种动态编程语言,用于实现网页的交互性和动态功能。它可以在用户的浏览器上运行,无需服务器交互。基础概念包括变量、数据类型、函数、条件语句和循环。JavaScript与DOM(Document...
目录 一,JS对象二,DOM–1,作用–2,测试三,Jquery–1,概述–2,使用步骤–3,入门案例–4,jQuery的文档就绪四,JQuery的语法–1,选择器–2,常用函数–3,常用事件–4,练习总结 一,JS对象 二,DOM –1,...
包含37个文件,涵盖18个JavaScript脚本文件、4个XML配置文件、3个Python脚本文件、3个Excel表格文件、2个PNG图片文件、2个HTML文件、1个Git忽略文件、1个IDE配置文件、1个字体文件和1个图片文件。该项目通过多种编程...
在个人博客中,JavaScript可以实现以下功能: 1. **导航菜单交互**:通过JavaScript,我们可以实现导航菜单的展开和折叠,以及高亮当前选中的页面。 2. **滚动效果**:比如滚动到顶部按钮、页面滚动时固定头部等。 3...
9. 数组定义:Javascript中的数组可以使用new Array()、new Array(10)或var a=[1,2,3]等形式定义。 10. 表达式运算:Javascript中的表达式运算可以是算术运算、比较运算、逻辑运算等,例如`a++==b?a:b`的结果是根据...
解释:在JavaScript中,数组定义可以使用new Array()或数组字面量,故C选项var a[10]={ 1,2,3};是错误的数组定义。 11. 设 var x=3,y=4; 以下表达式中 y 的值为 9 的是?(D)y+=x+2 解释:在JavaScript中,+=...
1. **跨语言通信**:JavaScript是一种广泛应用于Web开发的脚本语言,主要在浏览器环境中运行;而Delphi则是一种面向对象的编程语言,常用于开发Windows桌面应用。两者之间的通信需要借助特定的接口和桥接技术。 2. ...
在本文中,我们将探讨一些JavaScript设计缺陷,这些缺陷对JS新手和经验丰富的开发者来说都是让人头疼的问题。 1. 正则表达式的lastIndex属性 JS中的RegExp对象具有一个lastIndex属性,当正则表达式使用了表示全局...
在JavaScript中,正则表达式常用于数据验证、搜索与替换、字符串分割等任务,对于提升程序的灵活性和效率至关重要。 一、正则表达式基础 1. 创建正则表达式:可以使用构造函数`new RegExp(pattern)`或使用字面量...
在JavaScript学习的第一季第二部分中,我们将深入探讨以下几个关键概念: 1. 变量: JavaScript是动态类型语言,这意味着变量可以存储任何类型的数据,如数字、字符串、布尔值、对象等。变量的声明通常使用`var`...
第1题 编写一个脚本,该脚本要求用户输入两个整数,从用户那里获得这两个整数后,在一个警告框中显示较大的整数并在后面加上”is larger”。如果这两个整数相等,则在警告框中显示“These numbers are equal”。 第2...