0、主要区别
1、键的类型：
对象的键只能是字符串或符号。
Map的键可以是任意类型。
2、键的顺序：
对象的键顺序在现代JavaScript引擎中通常按插入顺序维护，但这是非标准行为，不应依赖。
Map的键值对按插入顺序迭代，符合标准。
迭代：
对象需要使用 for...in 或 Object.keys、Object.values、Object.entries 来迭代。
Map可以直接使用迭代器方法（如 forEach）或 for...of 迭代。
3、性能：
对象在添加和查找简单键值对时性能较好。
Map在频繁增删键值对时性能更优，因为Map是专门为此设计的。
4、内存管理：
Map会更有效地管理内存，尤其是当键是复杂对象时。
5、使用场景
对象：适合用来表示固定结构的实体数据（如用户信息、配置项等）。
Map：适合动态添加、删除键值对的场景，或者当需要使用非字符串类型的键时。
根据具体需求选择合适的数据结构，可以使代码更高效、易读。
1、定义对象key名字双引号的写法和省去双引号
let obj = {
name: "Alice",
age: 30
}; 这个obj对象的name为什么不需要用双引号扩起来，比如是let obj = {
"name": "Alice",
"age": 30
};
在JavaScript中，对象字面量中的属性名称可以省略引号，但有一些细节需要注意。
属性名称不使用引号的情况:
如果属性名称是一个有效的JavaScript标识符，则可以省略引号。有效的JavaScript标识符由字母、数字、下划线（_）和美元符号（$）组成，并且不能以数字开头。
在这个例子中，name 和 age 都是有效的JavaScript标识符，因此可以不使用引号:
let obj = {
name: "Alice",
age: 30
};
// 等价于
let obj = {
"name": "Alice",
"age": 30
};
属性名称需要使用引号的情况
如果属性名称中包含空格、特殊字符（如破折号），或者是一个数字，必须使用引号:
let obj = {
"first name": "Alice",
"last-name": "Smith",
123: "one two three"
};
// 使用方括号访问属性值
console.log(obj["first name"]); // Alice
console.log(obj["last-name"]); // Smith
console.log(obj[123]); // one two three
省略引号：如果属性名称是有效的JavaScript标识符，可以省略引号。
需要引号：如果属性名称包含空格、特殊字符或是数字，必须使用引号。
使用引号和不使用引号在功能上是等价的，只要属性名称符合相应的规则。
2、存放到对象：
将判断条件作为对象的属性名，将处理逻辑作为对象的属性值，在按钮点击的时候，通过对象属性查找的方式来进行逻辑判断，这种写法特别适合一元条件判断的情况。
const actions = {
'1': ['processing','IndexPage'],
'2': ['fail','FailPage'],
'3': ['fail','FailPage'],
'4': ['success','SuccessPage'],
'5': ['cancel','CancelPage'],
'default': ['other','Index'],
}
/**
* 按钮点击事件
* @param {number} status 活动状态：1开团进行中 2开团失败 3 商品售罄 4 开团成功 5 系统取消
*/
const onButtonClick = (status)=>{
let action = actions[status] || actions['default'],
logName = action[0],
pageName = action[1]
sendLog(logName)
jumpTo(pageName)
}
3、存放到map
new Map() 可以接受一个可迭代对象（如数组）来初始化一个新的 Map 实例。你提供的代码正是通过一个包含多个键值对的数组来创建一个 Map：
const actions = new Map([
[1, ['processing','IndexPage']], //键值对数组
[2, ['fail','FailPage']],
[3, ['fail','FailPage']],
[4, ['success','SuccessPage']],
[5, ['cancel','CancelPage']],
['default', ['other','Index']]
])
/**
* 按钮点击事件
* @param {number} status 活动状态：1 开团进行中 2 开团失败 3 商品售罄 4 开团成功 5 系统取消
*/
const onButtonClick = (status)=>{
let action = actions.get(status) || actions.get('default')
sendLog(action[0])
jumpTo(action[1])
}
console.log(actions.get(1)); // ['processing','IndexPage']
console.log(actions.get('default')); // ['other','Index']
使用 set 方法逐步添加键值对：
let map = new Map();
map.set(1, ['processing', 'IndexPage']);
map.set(2, ['fail', 'FailPage']);
map.set(3, ['fail', 'FailPage']);
map.set(4, ['success', 'SuccessPage']);
map.set(5, ['cancel', 'CancelPage']);
map.set('default', ['other', 'Index']);
console.log(map.get(1)); // ['processing','IndexPage']
console.log(map.get('default')); // ['other','Index']
这样写用到了es6里的Map对象，是不是更爽了？Map对象和Object对象有什么区别呢？
一个对象通常都有自己的原型，所以一个对象总有一个"prototype"键。
一个对象的键只能是字符串或者Symbols，但一个Map的键可以是任意值。
你可以通过size属性很容易地得到一个Map的键值对个数，而对象的键值对个数只能手动确认。
网友评论