别再绕晕 JS 类型转换！1 篇搞定所有常见场景，开发效率直接拉满

数组,集合,对象之间的转换

在 JavaScript 开发中，数组（Array）、集合（Set）、对象（Object）是最常用的数据结构，三者之间的转换是高频操作。本文不仅梳理基础转换方法，还补充实战场景案例、避坑细节和高效技巧，帮你应对实际开发中的各种需求。

数组->对象:将数组转为 “索引 - 值” 映射的对象。

const arr=['a','b','c']
const obj={}
// 1.手动遍历
for(let i=0;i<arr.length;i++){
    obj[i]=arr[i]
}
console.log(obj) // {0: 'a', 1: 'b', 2: 'c'}

// 2.使用Object.assign()
const obj2=Object.assign({},arr)
console.log(obj2) // {0: 'a', 1: 'b', 2: 'c'}

数组元素是对象

const arr=[{name:'a'},{name:'b'},{name:'c'}]
const obj={}
// 1.手动遍历
arr.forEach((item,index)=>{
    obj[index]=item.name
})
console.log(obj) // {0: 'a', 1: 'b', 2: 'c'}

对象->数组:转换的核心是提取对象的 “键”“值” 或 “键值对”，按需生成数组。

const obj={0: 'a', 1: 'b', 2: 'c'}
// 1.手动遍历
const arr=[]
for(let key in obj){
    arr.push(obj[key])
}
console.log(arr) // ['a','b','c']
// 2. 使用Object.keys(),Object.values(),Object.entries() 提取对象的键,值,键值对
console.log(Object.keys(obj)) // ['0','1','2']
console.log(Object.values(obj)) // ['a','b','c']
console.log(Object.entries(obj)) // [['0','a'],['1','b'],['2','c']]

数组->集合:对数组去重

const arr=[1,2,3,4,5]
const set=new Set(arr)
console.log(set) // Set(5) {1, 2, 3, 4, 5}
// 遍历去重
arr.forEach(item=>{
    if(!set.has(item)){
        set.add(item)
    }

})
console.log(set) // Set(5) {1, 2, 3, 4, 5}

集合->数组:Set 虽能去重，但缺乏数组的 map、filter 等方法，转为数组后可充分利用数组 API。

const set=new Set([1,2,3,4,5])
const arr=Array.from(set)
console.log(arr) // [1, 2, 3, 4, 5]
const arr1=[...set]
console.log(arr1) // [1, 2, 3, 4, 5]

集合->对象:类似于数组转为对象,转为对象需手动定义 “键”（常用索引或 Set 中的元素本身）。

const set=new Set(['a','b','c','d','e'])
const obj={}
[...set].forEach((item,index)=>{
    obj[index]=item
})
console.log(obj) // {0: 'a', 1: 'b', 2: 'c', 3: 'd', 4: 'e'}

对象->集合:类似于对象转换到数组(数组跟集合比较类似)

const obj={1: 'a', 2: 'b', 3: 'c', 4: 'd', 5: 'e'}
// 类似于转换为数组,添加去重功能
const set=new Set(Object.values(obj))
console.log(set) // Set(5) {'a', 'b', 'c', 'd', 'e'}
console.log(new Set(Object.keys(obj))) // Set(5) {'1', '2', '3', '4', '5'}
console.log(new Set(Object.entries(obj))) // Set(5) {['1', 'a'], ['2', 'b'], ['3', 'c'], ['4', 'd'], ['5', 'e']}