怎样把 JavaScript 对象 flatten 成单深度对象

在 JavaScript 开发中，有时我们需要将一个嵌套的对象转换为单深度对象，也就是将所有的嵌套属性都提升到顶层。这一操作在数据处理和存储等场景中非常有用。下面我们就来探讨一下实现这一目标的几种方法。

使用递归方法

递归是一种常见的解决此类问题的方式。我们可以遍历对象的每一个属性，如果该属性是一个对象，就继续递归地处理这个子对象。示例代码如下：

function flattenObject(obj) {
    const result = {};
    for (const key in obj) {
        if (obj.hasOwnProperty(key)) {
            if (typeof obj[key] === 'object' &&!Array.isArray(obj[key])) {
                const subObj = flattenObject(obj[key]);
                for (const subKey in subObj) {
                    if (subObj.hasOwnProperty(subKey)) {
                        result[`${key}.${subKey}`] = subObj[subKey];
                    }
                }
            } else {
                result[key] = obj[key];
            }
        }
    }
    return result;
}

这段代码首先创建了一个空对象 result 用于存储扁平化后的结果。然后遍历传入的对象 obj，如果属性值是一个对象，就递归处理该对象，并将处理后的子对象属性合并到 result 中，属性名通过拼接父属性名和子属性名来生成。如果属性值不是对象，则直接将该属性添加到 result 中。

使用 Object.assign() 和 reduce()

Object.assign() 方法用于将一个或多个源对象的所有可枚举属性复制到目标对象。reduce() 方法对数组中的每个元素按序执行一个由您提供的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。利用这两个方法，我们也可以实现对象扁平化。

function flattenWithReduce(obj) {
    return Object.keys(obj).reduce((acc, key) => {
        if (typeof obj[key] === 'object' &&!Array.isArray(obj[key])) {
            return Object.assign(acc, flattenWithReduce(obj[key]).reduce((innerAcc, innerKey) => {
                innerAcc[`${key}.${innerKey}`] = obj[key][innerKey];
                return innerAcc;
            }, {}));
        } else {
            acc[key] = obj[key];
            return acc;
        }
    }, {});
}

这种方法通过 Object.keys() 获取对象的所有属性名，然后使用 reduce() 遍历这些属性。如果属性值是对象，就递归调用 flattenWithReduce() 方法，并将结果合并到 acc 中。如果不是对象，则直接将属性添加到 acc 中。

通过上述方法，我们可以根据实际需求选择合适的方式将 JavaScript 对象 flatten 成单深度对象，提升数据处理的效率和灵活性。