javascript中的Map和Set

Posted 2021-12-15 低代码布道师

Map类似于Object，但是和Object不同的地方是Map的key可以是任意值，常用的Map的api

• new Map() 创建Map
• map.set(key, value) 存储值
• map.get(key) 取值
• map.has(key) 判断key是否存在
• map.delete(key) 删除key
• map.clear() 清空
• map.size 获取元素的数量

例如：

let map = new Map();

map.set('1', 'str1');   // a string key
map.set(1, 'num1');     // a numeric key
map.set(true, 'bool1'); // a boolean key

// remember the regular Object? it would convert keys to string
// Map keeps the type, so these two are different:
alert( map.get(1)   ); // 'num1'
alert( map.get('1') ); // 'str1'

alert( map.size ); // 3

迭代Map

let recipeMap = new Map([
  ['cucumber', 500],
  ['tomatoes', 350],
  ['onion',    50]
]);

// iterate over keys (vegetables)
for (let vegetable of recipeMap.keys()) 
  alert(vegetable); // cucumber, tomatoes, onion


// iterate over values (amounts)
for (let amount of recipeMap.values()) 
  alert(amount); // 500, 350, 50


// iterate over [key, value] entries
for (let entry of recipeMap)  // the same as of recipeMap.entries()
  alert(entry); // cucumber,500 (and so on)


recipeMap.forEach( (value, key, map) => 
  alert(`$key: $value`); // cucumber: 500 etc
);

Map的定义，可以使用数组进行初始化

// array of [key, value] pairs
let map = new Map([
  ['1',  'str1'],
  [1,    'num1'],
  [true, 'bool1']
]);

alert( map.get('1') ); // str1

可以使用对象进行初始化

let obj = 
  name: "John",
  age: 30
;

let map = new Map(Object.entries(obj));

alert( map.get('name') ); // John

可以使用Object.fromEntries将Map转换为Object

let map = new Map();
map.set('banana', 1);
map.set('orange', 2);
map.set('meat', 4);

let obj = Object.fromEntries(map.entries()); // make a plain object (*)

// done!
// obj =  banana: 1, orange: 2, meat: 4 

alert(obj.orange); // 2

Set，没有key，没有重复的值，可以使用的api

• new Set(iterable) 创建set
• set.add(value) 添加值
• set.delete(value) 删除值
• set.has(value) 值是否存在
• set.clear() 清空值
• set.size 返回元素的个数
  示例：

let set = new Set();

let john =  name: "John" ;
let pete =  name: "Pete" ;
let mary =  name: "Mary" ;

// visits, some users come multiple times
set.add(john);
set.add(pete);
set.add(mary);
set.add(john);
set.add(mary);

// set keeps only unique values
alert( set.size ); // 3

for (let user of set) 
  alert(user.name); // John (then Pete and Mary)

迭代set的方法

let set = new Set(["oranges", "apples", "bananas"]);

for (let value of set) alert(value);

// the same with forEach:
set.forEach((value, valueAgain, set) => 
  alert(value);
);