js中的new Map的使用教程

js中的new Map的使用教程

前言

主要通过三段论讲解:js中的new Map

一、是什么

map数据结构是es6中新出的语法,其本质也是键值对,只是其键不局限于普通对象的字符串

二、常用api

(1)创建map

var mymap = new Map() // 创建空map
var map2 = new Map([[1,2],[true,3]]) // 有初始参数的map

(2)map的方法
map有has,get, delete,set,clear 五种方法,还有个size属性
1.set方法 map添加新键值

var mymap = new Map()
mymap.set('name','童')

2.has方法 map是否有这个键

var mymap = new Map([['name','童'],[true,1]])
mymap.has('name') // true
mymap.has('sb') // false

3.get方法 获取map某个键的值

var mymap = new Map([['name','童'],[true,1]])
mymap.get('name') // 童
mymap.get(true) // 1

4.delete方法 删除map某个元素

var mymap = new Map([['name','童'],[true,1]])
mymap.delete('name')

5.clear方法:清空map

var mymap = new Map([['name','童'],[true,1]])
mymap.clear()

6.size属性 :返回map的成员数量

var mymap = new Map([['name','童'],[true,1]])
mymap.size // 2

三、实战场景

scence(level){
	switch (level){
		case 101:
			return '11' ;
		case 102:
			return '22' ;
		case 103:
			return '33' ;
		default:
			return '666' ;
	}

VS

scence(level){
	const myMap = new Map([
			[101,'11'],
			[102,'22'],
			[103,'33'],
		])
	return myMap.get(level) || '666' ;
}

总结

js中的new Map的使用教程,看完用起来

### 创建和使用 JavaScript `Map` 对象 #### 构造函数初始化 可以利用构造函数来创建一个新的 `Map` 实例。如果传递给构造函数的是一个可迭代对象,则该对象中的每一项都会被作为键值对加入到新的映射表里。 ```javascript const map = new Map([ ['key1', 'value1'], ['key2', 'value2'] ]); console.log(map.get('key1')); // 输出: value1 ``` #### 添加元素 要向现有的 `Map` 中添加数据,可以通过调用 `.set(key, value)` 方法实现。此操作会返回整个更新后的 `Map` 对象以便链式调用[^1]。 ```javascript let myMap = new Map(); myMap.set('name', 'Alice').set(42, true); console.log(myMap); // Map { 'name' => 'Alice', 42 => true } ``` #### 获取元素 为了访问已存入的数据,应该采用 `.get(key)` 函数形式指定想要检索的具体键名;当找不到对应记录时,默认情况下它将给出 `undefined` 值。 ```javascript console.log(myMap.get('name')); // Alice console.log(myMap.get(42)); // true console.log(myMap.get('missingKey')); // undefined ``` #### 遍历与转换成数组 对于遍历所有的条目而言,有几种方式可以选择:`.keys()` 返回所有键组成的迭代器、`.values()` 提供所有值得集合以及 `.entries()` 同时获取键值组合而成的列表。这些都可以很方便地配合扩展运算符或 Array.from 转化为常规数组结构用于进一步处理[^2]。 ```javascript // 将 Map 的 entries 变换为二维数组 Array.from(myMap.entries()); // 或者更简洁的方式 [...myMap.entries()] // 使用 map 方法加密消息并收集结果至新数组中 const messages = ["hello", "world"]; const caesar = str => /* 加密逻辑 */; messages.map(caesar); // 结合上述知识点构建完整的例子 function createEncryptedMessages(messageList){ const encryptedPairs = messageList.map((msg,idx)=>[idx,caesar(msg)]); return new Map(encryptedPairs); } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值