深圳网站建设公司流程wordpress质感

深圳网站建设公司流程,wordpress质感,wordpress百度蜘蛛只抓首页,网站地图怎么做_一、前言#xff1a;为什么需要 Set 和 Map#xff1f;在 JavaScript 中#xff0c;数组#xff08;Array#xff09;和对象#xff08;Object#xff09;是最常用的数据结构#xff0c;但它们在特定场景下存在明显短板#xff1a;数组查找元素需遍历#xff0c;时间…一、前言为什么需要 Set 和 Map在 JavaScript 中数组Array和对象Object是最常用的数据结构但它们在特定场景下存在明显短板数组查找元素需遍历时间复杂度 O (n)且去重需额外处理对象的键只能是字符串 /.Symbol无法直接使用引用类型作为键且无法快速获取键值对数量。ES6 引入的Set集合和Map映射正是为解决这些痛点而生 —— 它们提供了更高效的查找、插入、删除操作以及更灵活的键类型支持成为复杂业务场景的优选数据结构。二、Set不重复元素的有序集合2.1 核心特性元素唯一自动去重重复添加的元素会被忽略有序存储按插入顺序保存元素ES6 规范遍历顺序与插入顺序一致支持多种类型可存储字符串、数字、布尔值、引用类型对象、数组等无键名只有值本质是 “值 - 值” 映射可理解为 “只有键的数组”。2.2 常用 API含示例// 1. 初始化const set new Set([1, 2, 2, a, true]); // 自动去重Set(4) {1, 2, a, true}// 2. 增删改查set.add(3); // 添加元素Set(5) {1, 2, a, true, 3}set.delete(a); // 删除元素返回true成功/false失败set.has(2); // 查找元素返回trueset.size; // 获取长度4set.clear(); // 清空集合Set(0) {}// 3. 遍历方式const set2 new Set([x, y, z]);// 方式1for...of遍历for (const val of set2) {console.log(val); // x, y, z}// 方式2forEach遍历set2.forEach((val, index) {console.log(val); // x, y, zindex与val相同});// 方式3转换为数组const arr [...set2]; // [x, y, z]2.3 实战场景数组去重const uniqueArr [...new Set(arr)];简洁高效时间复杂度 O (n)数据筛选存储不重复的 ID、标签等如const userIds new Set([101, 102, 101]);快速判断存在性比数组indexOf更高效Set 查找为 O (1)数组为 O (n)。三、Map键值对的灵活映射3.1 核心特性键类型无限制可使用字符串、数字、对象、数组、Symbol 等作为键有序存储按插入顺序保存键值对遍历顺序与插入顺序一致键唯一重复设置同一键会覆盖旧值可迭代支持直接遍历无需像对象那样先获取键数组。3.2 常用 API含示例// 1. 初始化const map new Map([[name, 张三],[18, 年龄],[{ id: 1 }, 用户信息] // 对象作为键]);// 2. 增删改查map.set(gender, 男); // 添加键值对Map(4) {[name,张三], [18,年龄], [{id:1},用户信息], [gender,男]}map.get(18); // 获取值年龄map.has(name); // 查找键truemap.delete({ id: 1 }); // 注意对象键是引用类型需用同一引用才能删除map.size; // 获取长度3map.clear(); // 清空映射// 3. 遍历方式const map2 new Map([[a, 1], [b, 2]]);// 方式1遍历键值对最常用for (const [key, val] of map2) {console.log(key, val); // a 1, b 2}// 方式2遍历键/值for (const key of map2.keys()) { /* 遍历键 */ }for (const val of map2.values()) { /* 遍历值 */ }// 方式3forEach遍历map2.forEach((val, key) {console.log(key, val); // a 1, b 2});3.3 关键注意点引用类型作为键对象、数组等引用类型作为键时只有引用完全一致才视为同一键const obj1 { id: 1 };const obj2 { id: 1 };const map new Map([[obj1, test]]);map.get(obj2); // undefinedobj1与obj2是不同引用与对象的区别特性MapObject键类型任意类型字符串 / Symbol遍历顺序插入顺序无序ES6 前长度获取size 属性直接获取需手动计算Object.keys (obj).length迭代性直接迭代需先获取键数组四、Set 与 Map 的核心区别与选型建议4.1 核心区别维度SetMap存储结构单值集合值 - 值键值对映射键 - 值核心用途存储不重复元素键值对关联查询常用操作去重、判断存在性键值映射、数据关联遍历返回值直接返回元素返回 [key, value] 数组4.2 选型建议若需存储不重复的数据如 ID、标签、去重数组优先用Set若需键值对映射如配置表、缓存数据、字典优先用Map若键是引用类型如对象只能用Map若只需简单的字符串键映射且无需有序性可考虑普通对象但 Map 更灵活。五、性能优化与注意事项性能对比插入 / 删除 / 查找操作Set Map 数组 普通对象数据量越大优势越明显遍历速度Map Set 数组 普通对象Map/Set 直接迭代无需额外处理。注意事项Set的forEach回调中index 参数与 value 相同设计特性无需纠结Map的键是引用类型时需保存同一引用才能修改 / 删除避免隐式错误避免用for...in遍历 Map/Set不支持需用for...of或forEach序列化问题JSON.stringify无法直接序列化 Map/Set需手动转换为数组// Map序列化const map new Map([[a, 1]]);const json JSON.stringify([...map]); // [[\a\,1]]// Set序列化const set new Set([1, 2]);const json JSON.stringify([...set]); // [1,2]六、总结Set 和 Map 作为 ES6 的核心数据结构解决了数组和普通对象的诸多痛点Set 提供高效的不重复集合管理Map 提供灵活的键值对映射。掌握它们的特性、API 和适用场景能让你的代码更简洁、高效、易维护 —— 在数据去重、缓存管理、字典映射等场景中它们往往是比数组和对象更优的选择。建议在实际开发中多尝试用 Set/Map 替代传统数据结构感受其带来的开发效率提升