第二章前端开发ES6基础

目录

扩展运算符

概述

语法

应用

模板字符串

概述

应用

内置对象扩展

概述

数组扩展方法

字符串扩展方法

set数据结构

概述

基本使用

操作方法

遍历方法

认识symbol

概述

作用

基本使用

项目

---

扩展运算符

概述

扩展运算符（spread operator）是 ES6 中新增的一种运算符，用三个点（...）表示。它可以将一个类似数组或可迭代对象（例如字符串、Set、Map）的对象展开成逗号分隔的值列表。

扩展运算符可以用于函数调用、数组字面量、对象字面量等多种场景。

语法

1. 数组的展开操作

// 基本语法
[...array]

// 将两个数组合并
[...array1, ...array2]

// 将数组和其他元素合并
[...array, element1, element2, ..., elementN]

1. 对象的展开操作

// 基本语法
{...object}

// 将两个对象合并
{...object1, ...object2}

// 将对象和其他属性合并
{...object, key1: value1, key2: value2, ..., keyN: valueN}

1. 函数的传递参数

// 基本语法
functionname(...args)

// 将数组或类数组对象作为参数传递给函数
functionname(...array)

// 将对象作为参数传递给函数
functionname({...object})

需要注意的是，扩展运算符只能展开可迭代对象，即拥有 Symbol.iterator 属性的数据类型。因此，不能将普通的对象或类似对象的 null 和 undefined 进行展开。

应用

扩展运算符可以应用在很多地方，下面列举几个较常见的应用：

1. 数组合并

可以使用扩展运算符将两个或多个数组合并成一个数组。示例代码如下：

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const arr3 = [...arr1, ...arr2];

console.log(arr3);  // [1, 2, 3, 4, 5, 6]

1. 数组复制

可以使用扩展运算符复制一个数组。示例代码如下：

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

console.log(arr2);  // [1, 2, 3]

1. 函数传参

可以使用扩展运算符将数组作为函数的参数传递进去。示例代码如下：

function myFunction(x, y, z) {
  console.log(x, y, z);
}

const arr = [1, 2, 3];
myFunction(...ar