亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

TypeScript中Map和Set的實現(xiàn)示例

 更新時間:2025年06月04日 10:13:16   作者:周倦嵐  
本文主要介紹了TypeScript中Map和Set的實現(xiàn)示例, 文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧

一、Map(映射)

Map 是 ES6 引入的一種新的數(shù)據(jù)結(jié)構(gòu),它類似于對象,也是鍵值對的集合,但 Map 的鍵可以是任意類型的值(對象、原始值等),而不僅僅是字符串或 Symbol。

1.基本用法

// 創(chuàng)建一個空Map
const map = new Map();

// 創(chuàng)建時初始化
const initializedMap = new Map([
  ['key1', 'value1'],
  ['key2', 'value2']
]);
// 從對象創(chuàng)建Map
const obj = { a: 1, b: 2 };
const mapFromObject = new Map(Object.entries(obj));

2.常用方法和屬性

set(key, value) - 添加或更新鍵值對

map.set('name', 'Alice');
map.set(1, 'number key');
map.set({}, 'object key');
map.set(null, 'null key'); // 甚至可以使用null或undefined作為鍵

get(key) - 獲取鍵對應的值

const name = map.get('name'); // 'Alice'
const unknown = map.get('non-existent'); // undefined

has(key) - 檢查是否存在某個鍵

const hasName = map.has('name'); // true

delete(key) - 刪除某個鍵值對

 const deleted = map.delete('name'); // 返回布爾值表示是否刪除成功

clear() - 清空所有鍵值對

map.clear();

size - 獲取鍵值對數(shù)量

const size = map.size;

3.遍歷方法

keys() - 返回所有鍵的迭代器

for (const key of map.keys()) {
 console.log(key);
}
// 或者轉(zhuǎn)換為數(shù)組
const keysArray = Array.from(map.keys());

values() - 返回所有值的迭代器

for (const value of map.values()) {
 console.log(value);
}

entries() - 返回所有鍵值對的迭代器

for (const [key, value] of map.entries()) {
  console.log(key, value);
}
// 可以簡寫為
for (const [key, value] of map) {
  console.log(key, value);
}

forEach() - 遍歷所有鍵值對

map.forEach((value, key) => {
  console.log(key, value);
  // 注意:value在前,key在后,與數(shù)組的forEach不同
});

4.TypeScript 中的類型定義

// 明確指定鍵和值的類型
const typedMap = new Map<string, number>();
typedMap.set('age', 25); // 正確
typedMap.set('name', 'Alice'); // 錯誤,值應該是number類型

// 復雜類型示例
interface User {
  id: number;
  name: string;
}

const userMap = new Map<number, User>();
userMap.set(1, { id: 1, name: 'Alice' });

// 從現(xiàn)有類型派生Map類型
type UserMap = Map<number, User>;

5.Map 與普通對象的區(qū)別

  • Map 的鍵可以是任意類型,而對象的鍵只能是字符串或 Symbol
  • Map 的大小可以通過 size 屬性直接獲取,而對象需要手動計算
  • Map 在頻繁增刪鍵值對的場景下性能更好
  • Map 會維護鍵值對的插入順序
  • Map 可以直接遍歷,而對象需要先獲取鍵數(shù)組

6.使用場景

  • 需要鍵不是字符串/數(shù)字/Symbol的情況
  • 需要頻繁增刪鍵值對的場景
  • 需要維護插入順序的場景
  • 需要更便捷的遍歷和大小獲取的場景

二、Set(集合)

Set 是 ES6 引入的另一種數(shù)據(jù)結(jié)構(gòu),它類似于數(shù)組,但成員的值都是唯一的,沒有重復的值。

1.基本用法

// 創(chuàng)建一個空Set
const set = new Set();

// 創(chuàng)建時初始化
const initializedSet = new Set([1, 2, 3, 4]);

// 從類數(shù)組對象創(chuàng)建
const arrayLike = { 0: 'a', 1: 'b', length: 2 };
const setFromArrayLike = new Set(Array.from(arrayLike));

// 字符串會被拆分為字符
const charSet = new Set('hello'); // Set {'h', 'e', 'l', 'o'}

2.常用方法和屬性

add(value) - 添加值,返回Set本身(可以鏈式調(diào)用)

set.add(1).add(2).add(3);
set.add(NaN).add(NaN); // Set中NaN等于自身,只會保留一個

has(value) - 檢查是否存在某個值

const hasTwo = set.has(2); // true
set.has(NaN); // 可以正確檢測NaN

delete(value) - 刪除某個值

set.delete(2);

clear() - 清空所有值

set.clear();

size - 獲取值的數(shù)量

const size = set.size;

3.遍歷方法

values() - 返回所有值的迭代器

for (const value of set.values()) {
  console.log(value);
}

keys() - 與values()相同,為了與Map兼容

for (const key of set.keys()) {
  console.log(key);
}

entries() - 返回[value, value]形式的迭代器,為了與Map兼容

for (const [key, value] of set.entries()) {
  console.log(key, value); // 兩者相同
}

forEach() - 遍歷所有值

set.forEach((value) => {
  console.log(value);
  // 注意:參數(shù)設計為與Map的forEach一致
});

4.TypeScript 中的類型定義

// 明確指定值的類型
const typedSet = new Set<number>();
typedSet.add(1); // 正確
typedSet.add('1'); // 錯誤,值應該是number類型

// 復雜類型示例
interface Product {
  id: number;
  name: string;
}

const productSet = new Set<Product>();
productSet.add({ id: 1, name: 'Laptop' });

// 從現(xiàn)有類型派生Set類型
type ProductSet = Set<Product>;

5.Set 與數(shù)組的區(qū)別

特性Set數(shù)組
唯一性值唯一允許重復值
查找效率has方法O(1)includes/indexOf O(n)
添加元素add方法push/unshift等方法
刪除元素delete方法splice/filter等方法
順序插入順序可排序
索引訪問不支持支持下標訪問
大小獲取size屬性length屬性
內(nèi)存占用通常比數(shù)組多通常更節(jié)省內(nèi)存

6.使用場景

  • 需要存儲唯一值的場景
  • 需要快速檢查某個值是否存在的場景
  • 需要去重的場景
  • 數(shù)學集合運算(并集、交集、差集)

7.集合運算示例

// 并集
const union = new Set([...setA, ...setB]);

// 交集
const intersection = new Set([...setA].filter(x => setB.has(x)));

// 差集 (A - B)
const difference = new Set([...setA].filter(x => !setB.has(x)));

三、Map 和 Set 的性能特點

  • 查找速度:Map 和 Set 的查找操作(has/get)平均時間復雜度為 O(1),比數(shù)組的 O(n) 快
  • 插入速度:Map 和 Set 的插入操作平均時間復雜度為 O(1)
  • 刪除速度:Map 和 Set 的刪除操作平均時間復雜度為 O(1)
  • 內(nèi)存占用:Map 和 Set 通常比對象和數(shù)組占用更多內(nèi)存
  • 迭代性能:Map和Set的迭代速度與數(shù)組相當,對象迭代需要Object.keys等額外步驟

四、應用建議

  • 類型安全:
// 總是明確指定泛型類型
const userMap = new Map<number, User>(); 

合理選擇數(shù)據(jù)結(jié)構(gòu):

  • 需要鍵值對 → Map
  • 需要唯一值 → Set
  • 需要索引訪問 → 數(shù)組
  • 需要簡單鍵值且不頻繁修改 → 對象

內(nèi)存管理:

  • 對于臨時對象作為鍵/值,考慮WeakMap/WeakSet
  • 大型Map/Set不再需要時手動clear()

性能優(yōu)化:

  • 避免在熱代碼路徑中頻繁創(chuàng)建新的Map/Set
  • 對于大型數(shù)據(jù)集,考慮預分配大小

不可變數(shù)據(jù):

// 需要不可變Map/Set時
function addToImmutableSet<T>(set: Set<T>, value: T): Set<T> {
  return new Set([...set, value]);
} 

與數(shù)組轉(zhuǎn)換:

// Map轉(zhuǎn)數(shù)組
const mapEntries = [...map.entries()];
// Set轉(zhuǎn)數(shù)組
const setValues = [...set];

自定義相等性:

// 對于對象值,需要自定義相等邏輯
const objectSet = new Set<{id: number}>();
const obj1 = {id: 1};
const obj2 = {id: 1};
objectSet.add(obj1);
objectSet.has(obj2); // false,因為對象引用不同

五、總結(jié)

特性MapSet
存儲內(nèi)容鍵值對唯一值
鍵/值類型任意類型任意類型
主要方法set, get, has, deleteadd, has, delete
遍歷方式keys, values, entriesvalues, keys, entries
典型用途需要非字符串鍵的鍵值對存儲值唯一性檢查、集合運算
是否有序插入順序插入順序

1.何時選擇Map/Set:

  • 需要非字符串鍵 → Map
  • 需要嚴格維護插入順序 → Map/Set
  • 需要頻繁增刪元素 → Map/Set
  • 需要高效存在性檢查 → Set
  • 需要集合運算 → Set

2.何時選擇對象/數(shù)組:

  • 需要索引訪問 → 數(shù)組
  • 簡單配置對象 → 對象
  • 需要方法操作(如map/filter)→ 數(shù)組
  • 小型靜態(tài)數(shù)據(jù)集 → 對象/數(shù)組

在 TypeScript 中使用 Map 和 Set 時,建議總是明確指定泛型類型參數(shù),以獲得更好的類型檢查和代碼提示。這兩種數(shù)據(jù)結(jié)構(gòu)在處理特定問題時比傳統(tǒng)的對象和數(shù)組更高效、更直觀。

到此這篇關(guān)于TypeScript中Map和Set的實現(xiàn)示例 的文章就介紹到這了,更多相關(guān)TypeScript Map和Set內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論