JS教你如何在对象内任意位置插入任意属性

Posted 2021-10-19 码小余の博客

【JS】教你如何在对象内任意位置插入任意属性

如果你不知道我写这篇文章的目的是什么，那不妨想想这样一个场景

var obj = {
    a: "A",
    c: "C",
    d: "D"
}

我想在 a 属性后面添加属性 b ，使其成为以下对象格式

var obj = {
    a: "A",
    b: "B",
    c: "C",
    d: "D"
}

你会怎么做，将对象转成字符串然后截串操作？不不不，这样太麻烦了，而且非常不灵活（你如果是大佬可以这么干哦~）

在 JS 中数组操作很灵活，想办法将对象转换成数组

将对象转换成数组

// 将对象转换成数组
var arr = []
for (let i in obj) {
    let o = {};
    o[i] = obj[i]; //即添加了key值也赋了value值 o[i] 相当于o.name 此时i为变量
    arr.push(o)
}

打印 arr 会得到以下数组

[
    { a: "A" },
    { c: "C" },
    { d: "D" }
]

现在就可以操作这个数组了

// 如果 b 属性不存在
if (!obj.hasOwnProperty("b"))) {
    // 在arr中索引为 1 的位置插入对象
    arr.splice(1, 0, { "b": "B" })
}

打印 arr 会得到以下数组

[
    { a: "A" },
    { b: "B" },
    { c: "C" },
    { d: "D" }
]

将数组转换成对象

// 将数组转换成对象
var result = {}
arr.forEach((item) => {
    result[Object.keys(item)[0]] = Object.values(item)[0]
})

打印 result 会得到以下对象

{
    a: "A",
    b: "B",
    c: "C",
    d: "D"
}