JavaScript：向可能不存在的对象添加嵌套属性

Question

假设我有一个 json 对象，其中记录了我的网站的访问者数量，按浏览器/版本分组。

let data = {
    browsers: {
        chrome: {
           43 : 13, 
           44 : 11
        }, 
        firefox: {
           27: 9
        }
    }
}

要增加特定的浏览器，我需要检查是否存在多个键，如果不存在，则创建它们。

let uap = UAParser(request.headers['user-agent']);

if (typeof uap.browser !== 'undefined') {

    if (typeof data.browsers === 'undefined') 
        data.browsers = {}

    if (typeof data.browsers[uap.browser.name] === 'undefined')
        data.browsers[uap.browser.name] = {}

    if (typeof data.browsers[uap.browser.name][uap.browser.version] === 'undefined')
        data.browsers[uap.browser.name][uap.browser.version] = 0

    data.browsers[uap.browser.name][uap.browser.version] += 1;
}

我的数据结构越深，事情就会变得越疯狂。

感觉必须有一种更简洁的方法在 javascript 中做到这一点。总有一种更简洁的方法。有人可以在这里启发我吗？

Answer 1

这个较短的代码应该可以解决问题：

if (uap.browser) { // typeof is pretty much redundant for object properties.
    const name = uap.browsers.name; // Variables for readability.
    const version = uap.browser.version;

    // Default value if the property does not exist.
    const browsers = data.browsers = data.browsers || {}; 
    const browser = browsers[name] = browsers[name] || {};
    browser[version] = browser[version] || 0;

    // Finally, increment the value.
    browser[version]++;
}

请注意，您在===应该使用的地方使用了=（在 中=== {}）。

我们来解释一下这一行：

const browsers = data.browsers = data.browsers || {};

最后一部分：如果存在则data.browsers = data.browsers || {}设置data.browsers为自身。如果还没有，则将其设置为一个新的空对象。
然后，整个值被分配给browsers，以便于访问。

现在，较短的代码不应该是首要任务，但在这种情况下，您可以使代码更具可读性。