为什么在JavaScript中[1,2] + [3,4] =“ 1,23,4”?

2020/09/28 18:01 · javascript ·  · 0评论

我想将一个数组的元素添加到另一个数组中,所以我尝试了一下:

[1,2] + [3,4]

它回应:

"1,23,4"

到底是怎么回事?

+操作者没有为数组定义

发生的事情是Javascript 将数组转换为字符串并将其连接起来。

 

更新资料

由于这个问题以及随之而来的答案引起了我的广泛关注,因此我认为操作员的总体行为进行概述也将是有用且有意义的+

所以,就到这里。

除E4X和特定于实现的内容外,Javascript(自ES5起)具有6种内置数据类型

  1. 未定义
  2. 空值
  3. 布尔型
  4. 目的

请注意,尽管对于Null和可调用对象而言,typeof 返回值有些令人困惑 ,但Null实际上不是对象,严格来讲,在符合规范的Javascript实现中,所有函数都被视为对象。objectfunction

没错-Javascript 没有原始数组只有Array使用某种语法糖来调用Object的实例才能减轻痛苦。

添加更多的混乱,包装等实体new Number(5)new Boolean(true)并且new String("abc")是所有object类型,而不是数字,布尔值或字符串正如人们所预料。不过对于算术运算符Number,其Boolean行为与数字相同。

容易吧?完成所有这些工作后,我们可以继续进行概述本身。

+按操作数类型的不同结果类型

            || undefined | null   | boolean | number | string | object |
=========================================================================
 undefined  || number    | number | number  | number | string | string | 
 null       || number    | number | number  | number | string | string | 
 boolean    || number    | number | number  | number | string | string | 
 number     || number    | number | number  | number | string | string | 
 string     || string    | string | string  | string | string | string | 
 object     || string    | string | string  | string | string | string | 

*适用于Chrome13,FF6,Opera11和IE9。读者可以自己检查其他浏览器和版本。

注意:CMS所指出的那样,对于某些情况下的对象(例如和)NumberBoolean自定义+操作符不一定会产生字符串结果。它可以根据对象到原始转换的实现而有所不同。例如var o = { valueOf:function () { return 4; } };评估o + 2;产品6a number,评估o + '2'产品'42'a string

要查看概述表是如何生成的,请访问http://jsfiddle.net/1obxuc7m/

JavaScript的+运算符有两个目的:加两个数字或连接两个字符串。它没有针对数组的特定行为,因此它将数组转换为字符串,然后将其连接。

如果你想加入两个数组,以产生一个新的,使用.concat方法代替:

[1, 2].concat([3, 4]) // [1, 2, 3, 4]

如果要有效地将一个数组中的所有元素添加到另一个数组中,则需要使用.push方法

var data = [1, 2];

// ES6+:
data.push(...[3, 4]);
// or legacy:
Array.prototype.push.apply(data, [3, 4]);

// data is now [1, 2, 3, 4]

+操作员的行为ECMA-262 5e第11.6.1节中定义

11.6.1加法运算符(+)

加法运算符执行字符串连接或数字加法。生产AdditiveExpression : AdditiveExpression + MultiplicativeExpression评估如下:

  1. 我们lref要评估的结果AdditiveExpression
  2. 我们lvalGetValue(lref)
  3. 我们rref要评估的结果MultiplicativeExpression
  4. 我们rvalGetValue(rref)
  5. 我们lprimToPrimitive(lval)
  6. 我们rprimToPrimitive(rval)
  7. 如果Type(lprim)String或者Type(rprim)String,则

    1. 返回ToString(lprim)连接后跟的字符串ToString(rprim)
  8. 返回应用加法运算的结果ToNumber(lprim)ToNumber(rprim)请参见下面的注释11.6.3。

您可以看到每个操作数都已转换ToPrimitive通过进一步阅读,我们可以发现ToPrimitive它将始终将数组转换为字符串,从而产生此结果。

它将两个数组视为字符串相加

第一个数组的字符串表示形式为“ 1,2”,第二个数组的字符串表示形式为“ 3,4”因此,当+找到符号,它不能对数组求和,然后将它们串联为字符串。

+concats字符串,因此它的数组转换为字符串。

[1,2] + [3,4]
'1,2' + '3,4'
1,23,4

要组合数组,请使用concat

[1,2].concat([3,4])
[1,2,3,4]

在JavaScript中,二进制加法运算符(+)同时执行数字加法和字符串连接。但是,当它的第一个参数既不是数字也不是字符串时,则将其转换为字符串(因此为“ 1,2”),然后对第二个“ 3,4执行相同操作,并将它们连接为“ 1,23,4”。

尝试改用Arrays的“ concat”方法:

var a = [1, 2];
var b = [3, 4];
a.concat(b) ; // => [1, 2, 3, 4];

它将单个数组转换为字符串,然后组合字符串。

看来JavaScript会将数组转换成字符串并将其连接在一起。如果要一起添加元组,则必须使用循环或map函数。

[1,2]+[3,4] 在JavaScript中与评估相同:

new Array( [1,2] ).toString() + new Array( [3,4] ).toString();

因此,要解决您的问题,最好的办法是就地添加两个数组,或者不创建新数组:

var a=[1,2];
var b=[3,4];
a.push.apply(a, b);

它确实在执行您要求的操作。

您要添加的是数组引用(JS将其转换为字符串),而不是数字。有点像将字符串加在一起:"hello " + "world"="hello world"

如果您可以在JavaScript中重载运算符,但不能这样做,那就太好了:可以在JavaScript中
定义自定义运算符重载吗?
您只能在比较之前修改“ ==”运算符并将其转换为字符串:
http :
//blogger.xs4all.nl/peterned/archive/2009/04/01/462517.aspx

这是因为,+运算符假定操作数不是数字,而是字符串。因此,它首先将它们转换为字符串和concats,以给出最终结果(如果不是数字)。另外,它不支持数组。

这里的一些答案已经说明了意外的意外输出('1,23,4')的发生方式,还有一些答案已经说明了如何获得假定为预期的期望输出([1,2,3,4])的内容,即数组串联。但是,期望的期望输出的性质实际上有点模棱两可,因为最初的问题只是说明“我想将数组的元素添加到另一个数组中……”。可能意味着阵列串联,但它可能意味着元组除了(例如这里在这里),即添加元素的标量值在一个阵列中的对应的元件的标量值在第二,例如结合[1,2][3,4]获得[4,6]

假设两个数组的arity / length相同,这是一个简单的解决方案:

const arr1 = [1, 2];
const arr2 = [3, 4];

const add = (a1, a2) => a1.map((e, i) => e + a2[i]);

console.log(add(arr1, arr2)); // ==> [4, 6]

仅使用简单的“ +”号的另一个结果将是:

[1,2]+','+[3,4] === [1,2,3,4]

所以这样的事情应该起作用(但是!):

var a=[1,2];
var b=[3,4];
a=a+','+b; // [1,2,3,4]

...但是它将把变量a从数组转换成字符串!记在心上。

本文地址:http://javascript.askforanswer.com/weishenmezaijavascriptzhong12-34-1234.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!