当前位置: 首页 > news >正文

js基础速成-Set、Map

集合(Set)

集合是元素的集合,只能包含唯一元素

创建一个空集合

const companies = new Set()
console.log(companies)
Set(0) {}

从数组创建集合

const languages = ['英语','芬兰语','英语','法语','西班牙语','英语','法语',
]const setOfLanguages = new Set(languages)
console.log(setOfLanguages)
Set(4) {"英语", "芬兰语", "法语", "西班牙语"}

集合是可迭代对象,我们可以迭代每个元素。

const languages = ['英语','芬兰语','英语','法语','西班牙语','英语','法语',
]const setOfLanguages = new Set(languages)for (const language of setOfLanguages) {console.log(language)
}
  英语芬兰语法语西班牙语

向集合添加元素

const companies = new Set() // 创建一个空集合
console.log(companies.size) // 0companies.add('谷歌') // 向集合添加元素
companies.add('脸书')
companies.add('亚马逊')
companies.add('甲骨文')
companies.add('微软')
console.log(companies.size) // 集合中5个元素
console.log(companies)
Set(5) {"谷歌", "脸书", "亚马逊", "甲骨文", "微软"}

我们也可以使用循环向集合添加元素。

const companies = ['谷歌', '脸书', '亚马逊', '甲骨文', '微软']
setOfCompanies = new Set()
for (const company of companies) {setOfCompanies.add(company)
}
Set(5) {"谷歌", "脸书", "亚马逊", "甲骨文", "微软"}

从集合中删除元素

我们可以使用 delete 方法从集合中删除元素。

console.log(companies.delete('谷歌'))
console.log(companies.size) // 剩下4个元素

检查集合中是否有元素

has 方法可以帮助我们检查某个元素是否存在于集合中。

console.log(companies.has('苹果')) // false
console.log(companies.has('脸书')) // true

清空集合

这将移除集合中的所有元素。

companies.clear()
console.log(companies)
Set(0) {}

下面的例子展示了如何使用集合。

const languages = ['英语','芬兰语','英语','法语','西班牙语','英语','法语',
]
const langSet = new Set(languages)
console.log(langSet) // Set(4) {"英语", "芬兰语", "法语", "西班牙语"}
console.log(langSet.size) // 4const counts = []
const count = {}for (const l of langSet) {const filteredLang = languages.filter((lng) => lng === l)console.log(filteredLang) // ["英语", "英语", "英语"]counts.push({ lang: l, count: filteredLang.length })
}
console.log(counts)
[{ lang: '英语', count: 3 },{ lang: '芬兰语', count: 1 },{ lang: '法语', count: 2 },{ lang: '西班牙语', count: 1 },
]

集合的另一个用法是计算数组中的唯一项。

const numbers = [5, 3, 2, 5, 5, 9, 4, 5]
const setOfNumbers = new Set(numbers)console.log(setOfNumbers)
Set(5) {5, 3, 2, 9, 4}

集合的并集

可以使用扩展运算符来找到两个集合的并集。让我们找出集合 A 和集合 B 的并集(A U B)。

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]
let c = [...a, ...b]let A = new Set(a)
let B = new Set(b)
let C = new Set(c)console.log(C)
Set(6) {1, 2, 3, 4, 5, 6}

集合的交集

可以使用 filter 方法找到两个集合的交集。让我们找出集合 A 和集合 B 的交集(A ∩ B)。

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]let A = new Set(a)
let B = new Set(b)let c = a.filter((num) => B.has(num))
let C = new Set(c)console.log(C)
Set(3) {3, 4, 5}

集合的差集

可以使用 filter 方法找到两个集合之间的差集。让我们找出集合 A 和集合 B 的差集(A \ B)。

let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]let A = new Set(a)
let B = new Set(b)let c = a.filter((num) => !B.has(num))
let C = new Set(c)console.log(C)
Set(2) {1, 2}

映射(Map)

创建一个空映射

const map = new Map()
console.log(map)
Map(0) {}

从数组创建映射

countries = [['芬兰', '赫尔辛基'],['瑞典', '斯德哥尔摩'],['挪威', '奥斯陆'],
]
const map = new Map(countries)
console.log(map)
console.log(map.size)
Map(3) {"芬兰" => "赫尔辛基", "瑞典" => "斯德哥尔摩", "挪威" => "奥斯陆"}
3

向映射添加值

const countriesMap = new Map()
console.log(countriesMap.size) // 0
countriesMap.set('芬兰', '赫尔辛基')
countriesMap.set('瑞典', '斯德哥尔摩')
countriesMap.set('挪威', '奥斯陆')
console.log(countriesMap)
console.log(countriesMap.size)
Map(3) {"芬兰" => "赫尔辛基", "瑞典" => "斯德哥尔摩", "挪威" => "奥斯陆"}
3

从映射中获取值

console.log(countriesMap.get('芬兰'))
赫尔辛基

检查映射中的键

使用 has 方法检查映射中是否存在某个键。返回 truefalse

console.log(countriesMap.has('芬兰'))
true

通过循环获取映射中的所有值。

for (const country of countriesMap) {console.log(country)
}
(2) ["芬兰", "赫尔辛基"]
(2) ["瑞典", "斯德哥尔摩"]
(2) ["挪威", "奥斯陆"]
for (const [country, city] of countriesMap) {console.log(country, city)
}
芬兰 赫尔辛基
瑞典 斯德哥尔摩
挪威 奥斯陆
http://www.lryc.cn/news/449192.html

相关文章:

  • 手机软件何时统一——桥接模式
  • 【Nacos 架构 原理】服务发现模块之Nacos注册中心服务数据模型
  • 基于微信小程序爱心领养小程序设计与实现(源码+参考文档+定制开发)
  • 【数据库】 MongoDB 用户分配新的角色和权限
  • 加速 Python for 循环
  • 计算机毕业设计 基于Python国潮男装微博评论数据分析系统的设计与实现 Django+Vue 前后端分离 附源码 讲解 文档
  • React 表单与事件
  • Appium独立测试自动化初始化脚本
  • Nginx反向代理配置支持websocket
  • C# 游戏引擎中的协程
  • 如何封装微信小程序中的图片上传功能
  • 被问界/理想赶超!奔驰CEO再度“出马”,寻找中国外援
  • 魔改xjar支持springboot3,
  • python json文件读写
  • Android常用C++特性之std::find_if
  • 19 vue3之自定义指令Directive按钮鉴权
  • 数据资产新范式,URP城市焕新平台东博会首发!
  • 儿童乐园软件下载安装 佳易王游乐场会员扣次管理系统操作教程
  • windows下 Winobj.exe工具使用说明c++
  • 提示词工程 (Prompt Engineering) 最佳实践
  • 【读写分离?聊聊Mysql多数据源实现读写分离的几种方案】
  • C++游戏
  • 探索顶级低代码开发平台,实现创新
  • Html--笔记01:使用软件vscode,简介Html5--基础骨架以及标题、段落、图片标签的使用
  • 探索反向传播:深度学习中优化神经网络的秘密武器
  • K8S精进之路-控制器DaemonSet -(3)
  • 【JVM】类加载机制
  • ENV | 5步安装 npm node(homebrew 简洁版)
  • EasyExcel全面实战:掌握多样化的Excel导出能力
  • 基于springcloud的药品销售系统