重庆分公司,新征程启航

为企业提供网站建设、域名注册、服务器等服务

concat是不是es6语法

这篇文章主要介绍“concat是不是es6语法”,在日常操作中,相信很多人在concat是不是es6语法问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”concat是不是es6语法”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

站在用户的角度思考问题,与客户深入沟通,找到防城港网站设计与防城港网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:成都网站建设、成都网站制作、企业官网、英文网站、手机端网站、网站推广、域名注册、网页空间、企业邮箱。业务覆盖防城港地区。

concat不是es6语法,它是es5时就有的,优点是兼容性高,不需要转译。concat方法用于多个数组的合并,使用语法“原数组对象.concat(新值)”;该方法可接受数组参数,也可接受其他类型的值作为参数。concat方法会将新数组的成员,添加到原数组成员的后部,然后返回一个新数组,原数组不变。

concat不是es6语法,它是es5时就有的。

ES5 数组方法concat()

concat方法用于多个数组合并。它将新数组的成员,添加到原数组成员的后部,然后返回一个新数组,原数组不变

  • 请注意,concat()方法并没有修改当前Array,而是返回了一个新的Array

['hello'].concat(['world'])
// ["hello", "world"]

['hello'].concat(['world'], ['!'])
// ["hello", "world", "!"]

[].concat({a: 1}, {b: 2})
// [{ a: 1 }, { b: 2 }]

[2].concat({a: 1})
// [2, {a: 1}]

除了数组作为参数,concat也接受其他类型的值作为参数,添加到目标数组尾部。

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

  • 实际上,concat()方法可以接收任意个元素和Array,并且自动把Array拆开,然后全部添加到新的Array里。即如果要进行concat() 操作的参数是数组,那么添加的是数组中的元素,而不是数组。

var arr = ['A', 'B', 'C'];
arr.concat(1, 2, [3, 4]); // ['A', 'B', 'C', 1, 2, 3, 4]

注意:concat只会拉平数组参数一次,不会拉平两次

arr.concat([1, [2, 3]]); // [1, 2, 3, 1, [2, 3]]

  • 如果数组成员包括对象,concat方法返回当前数组的一个浅拷贝。所谓“浅拷贝”,指的是新数组拷贝的是对象的引用

var obj = { a: 1 };
var oldArray = [obj];

var newArray = oldArray.concat();

obj.a = 2;
newArray[0].a // 2

上面代码中,原数组包含一个对象,concat方法生成的新数组包含这个对象的引用。所以,改变原对象以后,新数组跟着改变

扩展知识:数组合并的另一种方法

使用ES6扩展运算符合并

const name1 = ['A','B','C'];
        const name2 = ['D','E','F'];
        const name = [...name1,...name2]
        console.log(name);

concat是不是es6语法

对比:ES6扩展运算符...与ES5-concat

concat是es5时就有的,优点是兼容性高,不需要转译

...是es6新出的语法,简化了写法,代码看上去更简洁直观,但实际只是做了封装,底层还是用的原来的方法,如下为babel转译的结果

arr1 = [...arr1, ...arr2];
  ↓ 相当于
function _toConsumableArray(arr) {
 if (Array.isArray(arr)) { 
   for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; 
   } else { return Array.from(arr); }
}
arr1 = [].concat(_toConsumableArray(arr1), arr2);

到此,关于“concat是不是es6语法”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注创新互联网站,小编会继续努力为大家带来更多实用的文章!


网站栏目:concat是不是es6语法
URL分享:http://cqcxhl.com/article/igehed.html

其他资讯

在线咨询
服务热线
服务热线:028-86922220
TOP