ES6 扩展运算符 三个点(...)
2024-10-19 13:31:55
它是什么
es6中引入扩展运算符(...),它用于把一个数组转化为用逗号分隔的参数序列,它常用在不定参数个数时的函数调用,数组合并等情形。因为typeScript是es6的超集,所以typeScript也支持扩展运算符。
用在哪儿
可变参数个数的函数调用
function push(array, ...items) {
array.push(...items);
}
function add(...vals){
let sum=0;
for(let i=0;i<vals.length;i++){
sum+=vals[i];
}
return sum;
}
let arr = [1,2,3,4,5,6];
let sum = add(...arr);
console.log(sum); //21
更便捷的数组合并
let arr1 = [1,2];
let arr2 = [5,6];
let newArr = [20];
//es5 旧写法
newArr = newArr.concat(arr1).concat(arr2); //[20,1,2,5,6]
console.log(newArr);
//es6 使用扩展运算符
newArr = [20,...arr1,...arr2]; //[20,1,2,5,6]
console.log(newArr);
替代es5的apply方法
// ES5 的写法
function f(x, y, z) {
// ...
}
var args = [0, 1, 2];
f.apply(null, args);
// ES6 的写法
function f(x, y, z) {
// ...
}
var args = [0, 1, 2];
f(...args);
求最大值Math.max()
// ES5 的写法
Math.max.apply(null, [14, 3, 77])
// ES6 的写法
Math.max(...[14, 3, 77])
// 等同于
Math.max(14, 3, 77);
通过push函数,将一个数组添加到另一个数组的尾部
// ES5 的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
// ES6 的写法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);
新建Date类型
// ES5
new (Date.bind.apply(Date, [null, 2015, 1, 1]))
// ES6
new Date(...[2015, 1, 1]);
与解构赋值结合,生成新数组
// ES5
a = list[0], rest = list.slice(1)
// ES6
[a, ...rest] = list
下面是另外一些例子。
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = [];
first // undefined
rest // []:
const [first, ...rest] = ["foo"];
first // "foo"
rest // []
将字符串转为真正的数组
[...'hello']
// [ "h", "e", "l", "l", "o" ]
将实现了 Iterator 接口的对象转为数组
var nodeList = document.querySelectorAll('div');
var array = [...nodeList];
最新文章
- XLT格式化XML那点事(C#代码中的问题解决)(二)
- java反射小例子
- Atitit.url 汉字中文路径&#160;&#160;404&#160;resin4 resin &#160;解决&#160;&#160;v2 q329
- bootstrap学习笔记<;十>;(按钮组,导航)
- [转]网络时间的那些事及 ntpq 详解
- Windows动态链接库DLL
- 错误代码: 1005 Can&#39;t create table &#39;hibernate.bill&#39; (errno: 150)
- C#制作ActiveX控件及部署升级(摘自网络)
- JMeter学习资料
- 跟我学系列教程——《13天让你学会Redis》火热报名中
- 微信OPENID授权方法
- GC(Garbagecollection)垃圾回收
- Xamarin开发笔记—WebView双项事件调用
- PBOC圈存时用到3DES加密解密以及MAC计算方法
- java.util.ConcurrentModificationException异常排查
- Codeforces Goodbye 2018
- Java工程师必备
- centos7忘记密码处理办法
- 安卓端数据导出成txt文件
- Homebrew&;Mongod