解释

Map是一种 js 数据结构，与数组的 map 办法并非一种，要辨别开来Map数据结构来治理数据，能进步代码的可读性Map 相比拟 对象格局 存储速度要更快

Map 数据结构

// 创立一个Map对象const formData = new Map();// 增加表单元素的值到Map中formData.set('username', 'Tom');formData.set('password', '123456');// 获取表单元素的值const username = formData.get('username');// username = Tomconst password = formData.get('password');// password = 123456

通过应用Map来治理数据，能够使代码更加简洁和易于保护。

同时，Map也提供了一些不便的办法，如set()、get()、has()、delete()等，能够不便地对数据进行操作。

应用场景

1. 治理表单数据

当页面中有多个表单元素须要进行数据交互时，能够应用Map来存储表单数据。例如：

const formData = new Map();formData.set('username', 'Tom');formData.set('password', '123456');// 通过get()办法来获取已存储的数据const username = formData.get('username');// username = Tomconst password = formData.get('password');// password = 123456
2. 治理页面状态

当页面中存在一些状态须要治理时，能够应用Map来存储状态。例如：

const state = new Map();state.set('loading', false);state.set('error', null);// 通过set()办法来更新已存储的数据state.set('loading', true);state.set('error', '申请失败');
3. 治理列表数据

当页面中存在一个列表须要治理时，能够应用Map来存储列表数据。例如：

const list = new Map();list.set(1, { id: 1, name: 'Tom' });list.set(2, { id: 2, name: 'Join' });// 通过get()办法来获取已存储的数据const item = list.get(1); // item = { id: 1, name: 'Tom' }const item = list.get(2); // item = { id: 2, name: 'Join' }
4. 治理缓存数据

当咱们须要缓存一些数据时，能够应用Map来存储缓存数据。例如：

const cache = new Map();cache.set('key1', 'value1');cache.set('key2', 'value2');// 通过get()办法来获取已存储的数据const value = cache.get('key1');// value = value1const value = cache.get('key2');// value = value2