Blog
首页
文档
收藏
关于
  • 在线转换时间戳 (opens new window)
  • 在线压缩图片 (opens new window)
  • Float-Double转二进制 (opens new window)
  • 文件转Hex字符串 (opens new window)

HiuZing

🍑
首页
文档
收藏
关于
  • 在线转换时间戳 (opens new window)
  • 在线压缩图片 (opens new window)
  • Float-Double转二进制 (opens new window)
  • 文件转Hex字符串 (opens new window)
  • 前端面试题

  • JavaScript

    • JavaScript语法

    • JavaScipt对象

      • JavaScript-Date对象
      • JavaScript-Set对象
        • JavaScript-Object对象
        • JavaScript-Map对象
        • JavaScript-Array对象
        • JavaScript-String对象
        • JavaScript-prototype对象
        • JavaScript-RegExp对象
        • JavaScript-Number对象
        • JavaScript-全局属性
      • JavaScript实例

      • JavaScript浏览器BOM

      • JavaScript DOM

    • Vue2

    • port

    • CSS

    • Node.js

    • JavaScript优化

    • uniapp

    • Mini Program

    • TypeScript

    • 面向对象编程

    • UI组件

    • Plugin

    • Vue3

    • 性能优化

    • Axios

    • 状态管理

    • React

    • Mock

    • Icon

    • Template

    • 构建工具

    • 项目规范配置

    • Taro

    • SVG

    • React Native

    • 前端
    • JavaScript
    • JavaScipt对象
    HiuZing
    2022-10-08
    目录

    JavaScript-Set对象

    # Set对象

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

    集合的属性和方法:

    1. size 返回集合的元素个数
    2. add 增加一个新元素,返回当前集合
    3. delete 删除元素,返回 boolean 值
    4. has 检测集合中是否包含某个元素,返回 boolean 值

    # 基本用法

    • 创建Set

      const set = new Set()
      
      1
    • 向Set添加元素(如果添加相等的元素,则只会保存第一个元素)

      set.add('a')
      
      1
    • 删除由其值指定的元素(删除某个键,返回true。如果删除失败,返回false。)

      set.delete('a')
      
      1
    • 如果值存在则返回 true

      set.has('a')
      
      1
    • 返回元素计数

      set.size
      
      1
    • 清空数组

      set.clear()
      
      1

    # Set应用

    • 数组去重

      let arr = [1,2,3,4,5,4,3,2,1]
      //1.数组去重
      let result = [...new Set(arr)]
      console.log(result)//[ 1, 2, 3, 4, 5 ]
      
      1
      2
      3
      4
    • 并集

      let a = new Set([1,2,3])
      let b = new Set([4,5,6])
      let union = new Set([...a, ...b])
      console.log(union)//{ 1, 2, 3, 4, 5,6 }
      
      1
      2
      3
      4
    • 交集

      let a = new Set([1,2,3])
      let b = new Set([4,3,2])
      let intersect = new Set([...a].filter(x => b.has(x)))
      console.log(intersect)// {2,3}
      
      1
      2
      3
      4
    • 差集

      let a = new Set([1,2,3])
      let b = new Set([4,3,2])
      let difference = new Set([...a].filter(x => !b.has(x)))
      console.log(difference)//{1}
      
      1
      2
      3
      4

    # 遍历操作

    • Set.prototype.keys():返回键名的遍历器
    • Set.prototype.values():返回键值的遍历器
    • Set.prototype.entries():返回键值对的遍历器
    • Set.prototype.forEach():使用回调函数遍历每个成员
    let set = new Set(['red', 'green', 'blue']);
    
    // Set.prototype.keys():返回键名的遍历器
    for (let item of set.keys()) {
      console.log(item);
    }
    // red
    // green
    // blue
    
    
    // Set.prototype.values():返回键值的遍历器
    for (let item of set.values()) {
      console.log(item);
    }
    // red
    // green
    // blue
    
    
    // Set.prototype.entries():返回键值对的遍历器
    for (let item of set.entries()) {
      console.log(item);
    }
    // ["red", "red"]
    // ["green", "green"]
    // ["blue", "blue"]
    
    
    // Set.prototype.forEach():使用回调函数遍历每个成员
    let set = new Set([1, 4, 9]);
    set.forEach((value, key) => console.log(key + ' : ' + value))
    // 1 : 1
    // 4 : 4
    // 9 : 9
    
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    上次更新: 2024/08/14, 04:14:33
    JavaScript-Date对象
    JavaScript-Object对象

    ← JavaScript-Date对象 JavaScript-Object对象→

    最近更新
    01
    React Native 使用SVG
    08-13
    02
    Docker基础命令
    08-04
    03
    算数逻辑单元
    07-30
    更多文章>
    Theme by Vdoing | Copyright © 2021-2024 WeiXiaojing | 友情链接
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式