【Javascript修炼篇】如何对JSON格式进行转换

这将是我们几乎日常都会用到的一个超实用函数。

根据数据的多样性与结构，API 的响应可能会返回极其复杂的 JSON 对象。有时候，仅仅从整个 JSON 中抓取一个字段可能就不太够用了。我们可能需要提取多个字段来展示在网页上。每次手动遍历这样的复杂 JSON 显然不是个好主意。如果能将其转换为更简洁的 JSON，根据情况，那将是个不错的选择。

希望这些介绍已经足够了。让我们直奔主题吧。

这里，我要处理的是深度嵌套的 JSON。我会将其转化为简单的 JSON。

所以，这是我的示例 JSON：

const obj = {
    first: {
        first: '1',
        second: {
            second: true,
            third: {
                third: 'third',
                fourth: {
                    fourth: 4
                }
            }
        }
    }
}

我期望的输出是：

{first: '1', second: true, third: 'third', fourth: 4}

再仔细对比一下输入和输出，应该就能理解了吧。

现在，让我们动手实现这个功能：

const simpleObj = {};
function destructure(obj) {
    for (let key in obj) {
        const value = obj[key];
        const type = typeof value;
        if (['string', 'boolean'].includes(type) || (type === 'number' && !isNaN(value))) {
            simpleObj[key] = value;
        } else if (type === 'object') {
            Object.assign(simpleObj, destructure(value));
        }
    }
    return simpleObj;
}

console.log(destructure(obj));

for (let key in obj) { -> 遍历给定的对象。

const value = obj[key];
const type = typeof value;

获取实际的 value 和它的 type。

if (['string', 'boolean'].includes(type) || (type === 'number' && !isNaN(value))) {
            simpleObj[key] = obj[key];

验证键值是否为非 object 类型。如果不是 object，则复制到 simpleObj 中。

else if (typeof obj[key] === 'object') {
            Object.assign(simpleObj, destructure(obj[key]));
        }

如果是对象类型，则再次调用同一函数（这叫做“递归”），以深入对象的嵌套层级。同时，将所有内容赋值给 simpleObj。因此，在最后，这个单一对象将包含所有的键值对。

最后，返回这个对象并在控制台打印出来。

如果你有任何建议，让我知道如何能以更优秀的方式实现这个功能，我将非常感激。谢谢。