Typescript数组扩展使用

最新推荐文章于 2025-05-08 09:34:57 发布

原创最新推荐文章于 2025-05-08 09:34:57 发布 · 590 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#typescript #javascript #前端

ES6 专栏收录该内容

33 篇文章

订阅专栏

本文详细介绍了JavaScript ES6及之后版本中的新特性，包括展开运算符的使用，如数组和对象的展开、函数参数的剩余和解构赋值等。还涉及到Map、Set、生成器以及Array.from方法的应用。此外，还展示了如何将类数组对象转换为数组，并演示了不同版本中求最大值的方法。最后，文章探讨了数组合并、字符串转数组以及利用Array.from处理各种类型的迭代对象。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

console.log(...[5,7,9]);
console.log([1,3,5,7,9],...[2,4,6,8,10],1,4,5);

function myPush(arr, ...items){
    console.log(arr,...items);
    arr.push(...items);
    console.log(arr);
}
myPush([6,7,8,9],...[1,2,3,4,5]);

//求最大值
console.log(Math.max.apply(null,[100,90,2000]));//ES5 要调用apply展开数组
console.log(Math.max(...[100,90,2000]));//ES6 ...运算符直接展开
console.log(Math.max(100,90,2000));
//日期构造
console.log('ES5->',new (Date.bind.apply(Date,[null,2022,7,21])));
// @ts-ignore
console.log('ES6->',new Date(...[2022,7,21]));
//数组合并
let a1=[1,2,3];
let a2=[4,5,6];
let a3=[7,8,9];
//es5合并
console.log(a1.concat(a2,a3));
//es6合并
console.log([...a1,...a2,...a3]);
//数组解构
const [x1,...xn]=[1,2,3,4,5,6,7,8,9];
console.log(x1,xn);
// @ts-ignore
const [x2,...x2n]=[];
console.log(x2,x2n);
//字符串按字符转换成数组
// @ts-ignore
console.log([...'RemoteDev']);
// @ts-ignore
console.log([...'RemoteDev'].reverse());
//注:任何实现了Iterator接口的对象都可使用...转换为数组

//类数组,非真正数组
let noarray = {
    '0':'x',
    '1':'y',
    '2':'z',
    length:3
}
console.log(noarray);
console.log('by es5: ',[].slice.call(noarray));//es5方式转换类数组为数组
console.log('ES6 -> ',Array.from(noarray));//通过Array.from转换为数组

//Map
let mymap = new Map([
    [0,'x'],[1,'y'],[2,'z']
]);
// @ts-ignore
console.log([...mymap.keys()]);
// @ts-ignore
console.log([...mymap.values()]);

//生成器
let makeNum=function* (){
    yield 1;
    yield 2;
    yield 3;
};

// @ts-ignore
console.log([...makeNum()]);

console.log(Array.from('RemoteDev'));

console.log(Array.from( new Set([1,2,3,4,5,6])));

console.log(Array.from({length:10},()=>'Item'));//生成10个Item

console.log(Array.of(1,5,7,9));//将一组值转换成数组