ES6学习笔记（2）- ...的用法

若繁花逝尽

已于 2023-04-16 18:20:42 修改

阅读量224

点赞数

分类专栏： es6 文章标签： es6 学习笔记

于 2023-04-15 18:30:12 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_42979149/article/details/130173330

版权

es6 专栏收录该内容

5 篇文章

订阅专栏

文章介绍了ES6中的rest参数，用于获取函数的所有实参并以数组形式处理，替代了ES5中的arguments对象。同时，扩展运算符(...)可以将数组转换为参数序列，常用于数组合并、克隆和将伪数组转化为真数组。

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

rest参数

es6引入rest参数，用于获取函数的实参，用来代替arguments

// es5
function jishubu() {
	console.log(arguments);  // es5 arguments为object类型，
}

// es6
function jishubu(...args) {
	console.log(args);  // ['张三', '李四', '王五'], args为数组类型，可以用数组的一些方法，比如filter，map，some，every
}
jishubu('张三', '李四', '王五')

扩展运算符

「…」扩展运算符能将「数组」转换为逗号分隔的「参数序列」
例如：
声明一个数组

const arr = ['张三', '李四', '王五'];
// 声明一个函数
function jishubu() {
	console.log(arguments);
}

// 调用
jishubu(arr);  // arguments只有一个元素，是一个数组元素，如图1

jishubu(...arr); // 等同于把arr数组['张三', '李四', '王五']变为参数序列'张三', '李四', '王五'，此时arguments有三个元素，如图2

扩展运算符的应用

数组的合并

const arr = [1, 2, 3];
const arr1 = [4, 5, 6];
// es5
const res = arr.concat(arr1);

// es6
const res1 = [...arr, ...arr1];

数组的克隆

const arr = [1, 2, 3];
// es6
const res = [...arr]; // 浅拷贝

将伪数组转为真正的数组

const divs = document.querySelectorAll('div');
const divArr = [...divs];