ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(六)

简介: ES6-ES11-第一部分-let、const、解构赋值、模板字符串、简化对象写法、箭头函数、函数参数默认值、rest 参数、扩展运算符、Symbol、迭代器、生成器、Promise、Set、Map(六)

13.5 Promise 读取多个文件

不基于Promise实现:

// 导入文件模块
const fs = require('fs')
// 读取三个文件,将文件的内容按读取的顺序进行拼接输出
fs.readFile('./00-文本文件.txt', (err, data1) => {
  fs.readFile('./00-文本文件.txt', (err, data2) => {
    fs.readFile('./00-文本文件.txt', (err, data3) => {
      console.log(data1+'\n'+data2+'\n'+data3)
    })
  })
})

基于Promise实现

// 基于Promise实现
const p1 = new Promise((resolve, reject) => {
  // 读取第一个文件
  fs.readFile('./00-文本文件.txt', (err, data) => {
    // 调用成功函数,将读取到的数据传递给成功的回调函数
    resolve(data)
  })
})
// 执行回调函数
p1.then(value => {
  // 读取第二个文件,返回一个Promise对象,对象的结果为之前的数据加上新读取到的文件数据
  return new Promise((resolve, reject) => {
    fs.readFile('./00-文本文件.txt', (err, data) => {
      resolve(value + '\n' + data)
    })
  })
}).then(value => {
  // 读取第三个文件,返回一个Promise对象,对象的结果为之前的数据加上新读取到的文件数据
  return new Promise((resolve, reject) => {
    fs.readFile('./00-文本文件.txt', (err, data) => {
      resolve(value + '\n' + data)
    })
  })
}).then(value => {
  // 对读取到的数据进行输出
  console.log(value)
})

13.6 catch() 方法

catch() 方法可以用于捕获失败的Promise,并对其进行处理。

可以前面的then()不指定失败的回调函数,失败的回调函数在catch中指定,当前面有失败的Promise就会被catch捕获。

// 导入文件模块
const fs = require('fs')
// 基于Promise实现
const p1 = new Promise((resolve, reject) => {
  // 读取第一个文件
  fs.readFile('./00-文本文件.txt', (err, data) => {
    // 调用成功函数,将读取到的数据传递给成功的回调函数
    resolve(data)
  })
})
// 执行回调函数
p1.then(value => {
  // 读取第二个文件,返回一个Promise对象,对象的结果为之前的数据加上新读取到的文件数据
  return new Promise((resolve, reject) => {
    fs.readFile('./00-文本文件.txtxxxxxxxxxxxxxxxx', (err, data) => {
      if (err) reject(err)
      resolve(value + '\n' + data)
    })
  })
}).then(value => {
  // 读取第三个文件,返回一个Promise对象,对象的结果为之前的数据加上新读取到的文件数据
  return new Promise((resolve, reject) => {
    fs.readFile('./00-文本文件.txt', (err, data) => {
      resolve(value + '\n' + data)
    })
  })
}).then(value => {
  // 对读取到的数据进行输出
  console.log(value)
}).catch(reason => {
  console.log(reason)
})

catch()对错误信息进行捕获

14. 集合 – Set

ES6 提供了新的数据结构 Set(集合)。它类似于数组,但成员的值都是唯一的,集合实现了 iterator 接口,所以可以使用『扩展运算符』和『for…of…』进行遍历。

14.1 声明一个集合

// 声明一个空集合
    let s1 = new Set()
    console.log(s1, typeof s1)
    // 声明集合的同时可以传入一个参数(可迭代数据),作为集合的初始数据
    // 由于集合中不能有重复元素,所以集合会自动为我们去重
    let s2 = new Set([1,2,3,4,5,5,6,6,6,6,6])
    console.log(s2)

14.2 集合的属性和方法

1、size 返回集合的元素个数

2、add 增加一个新元素,返回当前集合

3、delete 删除元素,返回 boolean 值

4、has 检测集合中是否包含某个元素,返回 boolean 值

5、clear 清空集合,返回 undefined

let s2 = new Set([1,2,3,4,5,5,6,6,6,6,6])
    console.log(s2)
    // 1、size 返回集合的元素个数
    console.log(s2.size)
    // 2、add 增加一个新元素,返回当前集合
    console.log(s2.add(7))
    // 3、delete 删除元素,返回 boolean 值
    console.log(s2.delete(6))
    console.log(s2)
    // 4、has 检测集合中是否包含某个元素,返回 boolean 值
    console.log(s2.has(6))
    // 5、clear 清空集合,返回 undefined
    console.log(s2.clear())
    console.log(s2)

14.3 for of 遍历

let s2 = new Set([1,2,3,4,5,5,6,6,6,6,6])
      console.log(s2)
      for (const iterator of s2) {
        console.log(iterator)

14.4 使用扩展运算符

let s2 = new Set([1,2,3,4,5,5,6,6,6,6,6])
      console.log(s2)
      console.log(...s2)

14.5 集合实践

14.5.1 数组去重

14.5.2 交集

14.5.3 并集

14.5.4 差集

代码:

const arr1 = [1, 2, 3, 4, 5, 4, 3, 2, 1]
      const arr2 = [4, 5, 4, 6, 6]
      // ### 14.5.1 数组去重
      const res_arr1 = [...new Set(arr1)]
      console.log(res_arr1)
      // ### 14.5.2 交集
      const set1 = new Set(arr1)
      const set2 = new Set(arr2)
      // 在set1中也在set2中
      const res_arr2 = [...set2].filter( item=>{
        if ( set1.has(item) ) return true
        else return false
      } )
      // 简写
      // const res_arr2 = [...set2].filter((item) => set1.has(item))
      console.log(res_arr2)
      // ### 14.5.3 并集
      // 两个集合的合并
      const res_arr3 = [...set1, ...set2]
      console.log(res_arr3)
      // ### 14.5.4 差集
      // 求 set1 - set2
      // 在set1中不在set2中
      // set1中含有,判断set2中是否含有,有则过了,set2中没有则保留
      const res_arr4 = [...set1].filter((item) => !(set2.has(item)))
      console.log(res_arr4)

15. Map

ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合。但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。Map 也实现了iterator 接口,所以可以使用『扩展运算符』和『for…of…』进行遍历。

15.1 Map 声明

let map = new Map()

15.2 向Map中添加元素(键值对)

// 字符串为键, 字符串为值
      map.set('name', 'zs')
      // 字符串为键,函数为值
      map.set('f1', function () {
        console.log('Hello Map')
      })
      // 对象为键,数组为值
      const key = {
        age: 12,
      }
      map.set(key, ['a', 1, 2])
      console.log(map)

15.3 获取元素

console.log(map.get('name'))
      console.log(map.get('f1'))
      console.log(map.get(key))

15.4 Map的其他属性和API

// 获取Map的大小
      console.log(map.size)
      // 删除键值对
      map.delete('name')
      console.log(map)
      // 清空Map
      map.clear()
      console.log(map)

15.5 for of 遍历

for (const iterator of map) {
        console.log(iterator)
      }

遍历的结果为数组,数组的第一个元素为键,第二个元素为值。

15.6 扩展运算符

console.log(...map

相关文章
|
3天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
17 3
|
1月前
|
存储 自然语言处理 C++
map和set的简单介绍
map和set的简单介绍
20 1
|
1月前
|
存储 安全 Java
java集合框架及其特点(List、Set、Queue、Map)
java集合框架及其特点(List、Set、Queue、Map)
|
3月前
|
JavaScript 前端开发 定位技术
JavaScript 中如何代理 Set(集合) 和 Map(映射)
JavaScript 中如何代理 Set(集合) 和 Map(映射)
50 0
|
3月前
|
存储 安全 Java
Map和Set(JAVA)
Map和Set(JAVA)
50 1
|
3月前
|
编译器 C++ 容器
【C++学习手札】基于红黑树封装模拟实现map和set
【C++学习手札】基于红黑树封装模拟实现map和set
|
4天前
|
存储 搜索推荐 C++
【C++高阶(二)】熟悉STL中的map和set --了解KV模型和pair结构
【C++高阶(二)】熟悉STL中的map和set --了解KV模型和pair结构
|
24天前
|
存储 JavaScript 前端开发
set和map的区别
set和map的区别
33 4
|
1月前
|
存储 编译器 容器
用红黑树封装实现map和set
用红黑树封装实现map和set
14 0
|
1月前
|
存储 JSON C++
【C++】容器篇(五)—— map和set的基本介绍
【C++】容器篇(五)—— map和set的基本介绍