ES6语法新特性(下)

7. set

Set 是 ES6 提供的一种数据结构，它和数组很像，但是它里面的数据是不可重复的。

7.1.1 初始化

const set1 = new Set([1, 2, 3, 4, 5, 5]);
const set2 = new Set(['苹果','橘子','橘子']);
console.log(set1);
console.log(set2);
/*
控制台输出：
{1,2,3,4,5}
{'苹果','橘子'}
*/
1
2
3
4
5
6
7
8
9

7.1.2 添加数据

const set = new Set([1, 2, 3, 4, 5,5]);
set.add(7);
console.log(set);
/*
控制台输出：
{1,2,3,4,5,6}
*/
1
2
3
4
5
6
7

7.1.3 删除数据

const set = new Set([1, 2, 3, 4, 5,5]);
set.delete(3);
console.log(set);
/*
控制台输出：
{1,2,4,5}
*/
1
2
3
4
5
6
7

7.1.4 包含数据

const set = new Set([1, 2, 3, 4, 5,5]);
const res = set.has(1);
console.log(res);
/*
控制台输出：
true
*/
1
2
3
4
5
6
7

7.1.5 清空集合set中的所有数据

const set = new Set([1, 2, 3, 4, 5,5]);
set.clear();
1
2

8.数组操作

8.1.1 合并数组

let u1 = ['张三', '李四', '王五'];
let u2 = ['张无忌', '赵敏', '周芷若'];
let u3 = [...u1,...u2];
console.log(u3);

/*
控制台输出：
['张三', '李四', '王五','张无忌', '赵敏', '周芷若']
*/
1
2
3
4
5
6
7
8
9

8.1.2 includes()

//includes 用来判断该数组是否包含某个值，返回值是布尔值
let users = ['张三','李四'];
let res = users.includes('张三');
console.log(res);
//控制台输出：true
1
2
3
4
5

8.1.3 find()

//find 用来找到第一个符合条件的成员，没有找到返回 undefined
let users = [{ name: '张三', age: 18 }, { name: '李四', age: 20 }];
let user = users.find((item, index) =>
    item.age > 18
)
console.log(user);
/*
控制台输出
{name:'李四',age:20}
*/
1
2
3
4
5
6
7
8
9
10

8.1.4 findIndex()

//findIndex 用来找到第一个符合条件的成员的索引，没有的话返回 -1
let users = [{ name: '张三', age: 18 }, { name: '李四', age: 20 }];
let index = users.findIndex((item, index) =>
    item.age > 18
)
console.log(index)
//控制台输出：1
1
2
3
4
5
6
7

8.1.5 filter()

//filter 用来返回一个满足条件的新数组，不满足条件返回空数组
let users = [{ name: '张三', age: 18 }, { name: '李四', age: 20 }];
let array = users.filter((item, index) =>
    item.age > 21
)
console.log(array);
//控制台输出：Array(0)
1
2
3
4
5
6
7

8.1.6 map()

//map 用来返回一个对成员进行加工之后的新数组
let users = [{ name: '张三', age: 18 }, { name: '李四', age: 20 }];
let array = users.map((item, index) => {
    item.name += "666";
    item.age += 10;
    return item;
})
console.log(array);
/*
控制台输出：
0:{name:'张三666',age:28}
1:{name:'李四666',age:30}
*/
1
2
3
4
5
6
7
8
9
10
11
12
13

9. 字符串扩展方法

模板字符串是 ES6 新增加的创建字符串的方式

9.1 startsWith() 和 endsWith()

9.1.1 startsWith()

//表示该字符串参数是否在某个字符串头部
let message = "helloworld";
let res = message.startsWith("hello");
console.log(res);
//控制台输出：true
1
2
3
4
5

9.1.2endsWith()

//表示该字符串参数是否在某个字符串尾部
let message = "helloworld";
let res = message.endsWith("ww");
console.log(res);
//控制台输出：false
1
2
3
4
5

9.2 模板字符串

9.2.1 定义

模板字符串是 ES6 新增加的创建字符串的方式

定义方式：反引号

 let country = `中国`;
1

9.2.2 解析变量

let country = `world`;
let message = `hello ${country}`;
console.log(message);
//控制台输出：hello world
1
2
3
4

9.2.3 调用函数

const print = message=>message+"，2022-04-25";
let message = `${print('hello world!')}`;
console.log(message);
// 控制台输出： hello world! 2022-04-25
1
2
3
4