TypeScript中Map对象使用及Map与字典的区别详解

 更新时间:2024年01月23日 16:10:52   作者:3wj  
Map对象主要的应用场景在于数据重组和数据储存,下面这篇文章主要给大家介绍了TypeScript中Map对象使用及Map与字典的区别的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下

(1)Map的基础操作

//初始化Map的键和值,它们可以是任何类型,注意Map中所有的键或所有的值必须是相同类型
let nameList = new Map([
    ["key1", 1],
    ["key2", 2]
])
 
 //通过map.set设置键值对,返回该Map对象
nameList.set("key3", 3)
console.log(nameList)

//通过map.get获取键对应的值,如果不存在,则返回undefined
var getmap = nameList.get("key2")
var getmap2 = nameList.get("key999")
console.log(getmap)
console.log(getmap2)

//通过map.delete()删除键值对,删除则返回true,未删除则返回false
var deletemap = nameList.delete("key2")
console.log(deletemap)
console.log(nameList)

//通过has()判断 Map中是否包含所查找的键值,返回布尔型
var hasmap = nameList.has("key1")
var hasmap2 = nameList.has("key999")
console.log(hasmap)
console.log(hasmap2)

//通过clear()移除所有键值对,清楚Map
var clearmap = nameList.clear()
console.log(nameList)
 

(2)Map的迭代

Map的迭代有多种方式

1.使用for...of进行迭代,返回一个包含键值对的数组

let myMap = new Map()
myMap.set(0, "zero")
myMap.set(1, "one")

for (let [key, value] of myMap) {
  console.log(key, value)
}

2.使用forEach进行迭代,它会接受一个回调函数作为参数

let myMap = new Map()
myMap.set(0, "zero")
myMap.set(1, "one")

myMap.forEach((value, key) => {
  console.log(key, value)
})

3.使用 keys 方法迭代所有的键

let myMap = new Map()
myMap.set(0, "zero")
myMap.set(1, "one")

for (let key of myMap.keys()) {
  console.log(key)
}

4.使用 values 方法迭代所有的值

let myMap = new Map()
myMap.set(0, "zero")
myMap.set(1, "one")

for (let value of myMap.values()) {
  console.log(value)
}

需要注意的是,使用 for...of 或 forEach 迭代时,键值对的顺序与添加顺序一致;而使用 keys 或 values 迭代时,顺序与添加顺序无关。

(3)Map与字典的区别

在 TypeScript 中,Map 和字典(也叫关联数组或哈希表)都可以用来存储键值对。它们的主要区别在于内部实现方式和一些特性上。

Map 是 JavaScript 中的一个原生类,是一个可迭代的键值对的集合,其中每个键都是唯一的。它的键和值可以是任意类型的,可以通过 set 方法来添加新的键值对,通过 get 方法来获取值。Map 还有一些特殊的方法和属性,比如 size 属性,clear() 方法和 forEach() 方法等。在 TypeScript 中,我们可以直接使用 Map 类型来定义一个 Map 对象,例如:

const map = new Map<string, number>();
map.set('apple', 1);
map.set('banana', 2);
map.set('orange', 3);

字典(或关联数组或哈希表)则是一种常见的数据结构,也可以用来存储键值对,其中每个键也是唯一的。字典的实现方式一般是通过散列表(hash table)来实现的。在 TypeScript 中,我们通常会使用对象来模拟字典,例如:

const dict = { 
  apple: 1,
  banana: 2,
  orange: 3,
};

字典虽然在实现上可能更高效,但是它不是一个原生的类,也缺乏 Map 的一些特殊方法和属性。因此在 TypeScript 中,如果需要使用到这些特殊的方法和属性,或者需要确保键的顺序等问题,建议使用 Map。如果只是简单的存储键值对,可以使用对象或者字典。

总结

到此这篇关于TypeScript中Map对象使用及Map与字典的区别详解的文章就介绍到这了,更多相关TS Map对象与字典区别内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 微信小程序开发之左右分栏效果的实例代码

    微信小程序开发之左右分栏效果的实例代码

    本文以一个简单的小例子,简述在微信小程序开发中左右分栏功能的实现方式,主要涉及scroll-view ,列表数据绑定,及简单样式等内容,感兴趣的朋友跟随小编一起看看吧
    2019-05-05
  • JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】

    JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】

    这篇文章主要介绍了JS实现的将html转为pdf功能,结合完整实例形式分析了基于浏览器端插件jsPDF实现的HTML格式数据转换成pdf具体操作技巧,需要的朋友可以参考下
    2018-02-02
  • js操作css属性实现div层展开关闭效果的方法

    js操作css属性实现div层展开关闭效果的方法

    这篇文章主要介绍了js操作css属性实现div层展开关闭效果的方法,涉及javaScript操作css样式实现div弹出层的效果,非常具有实用价值,需要的朋友可以参考下
    2015-05-05
  • js数组的操作详解

    js数组的操作详解

    用js有很久了,但都没有深究过js的数组形式。偶尔用用也就是简单的string.split(char)。对于字符的处理很多情况下需要用到数组
    2013-03-03
  • JS删除某个父元素下的所有子元素

    JS删除某个父元素下的所有子元素

    JS中如何删除某个父元素下的所有子元素?这里我介绍几种方法,结合实例代码给大家介绍的非常详细,需要的朋友可以参考下
    2022-09-09
  • JS格式化时间的几种方法总结

    JS格式化时间的几种方法总结

    这篇文章介绍了JS格式化时间的方法,文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-04-04
  • uniapp电商小程序实现订单30分钟倒计时

    uniapp电商小程序实现订单30分钟倒计时

    这篇文章主要为大家详细介绍了uniapp电商小程序实现订单30分钟倒计时,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • JavaScript中变量提升和函数提升实例详解

    JavaScript中变量提升和函数提升实例详解

    这篇文章主要给大家介绍了关于JavaScript中变量提升和函数提升的相关资料,以及JS变量提升和函数提升的顺序,文中给出了详细的介绍,需要的朋友可以参考下
    2021-07-07
  • js实现div色块碰撞

    js实现div色块碰撞

    这篇文章主要为大家详细介绍了js实现div色块碰撞,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-01-01
  • html+js实现动态显示本地时间

    html+js实现动态显示本地时间

    显示本地时间的方法有很多,在本文将为大家介绍下如何使用html+js实现动态显示本地时间,感兴趣的朋友可以了解下
    2013-09-09

最新评论