递归获取JavaScript对象的嵌套属性

在日常的前端开发中，我们经常需要访问对象的深度属性。例如，考虑以下对象：

const user = {
  profile: {
    name: {
      first: "John",
      last: "Doe"
    },
    address: {
      city: "New York",
      zip: "10001"
    }
  }
};

如果我们要安全地访问user.profile.name.first，在不知道profile或name是否存在的情况下，直接访问会导致错误。

为了解决这个问题，让我们深入了解一个实用的get函数，它允许我们安全地访问对象的深度属性，而不必担心中间的属性是否存在。

get函数：核心逻辑

函数的基础版本如下：

function get(obj, path, fallback) {
  const parts = path.split(".");
  const key = parts.shift();
  const nextValue = obj[key];
  
  if (typeof nextValue !== "undefined") {
    return parts.length > 0 ? get(nextValue, parts.join("."), fallback) : nextValue;
  }
  return fallback;
}

此函数接受三个参数：

1. obj - 我们要访问的目标对象。
2. path - 用.分隔的属性路径字符串。
3. fallback - 如果在path中的任何点上属性不存在，返回的默认值。

如何工作？

1. 我们首先将路径字符串拆分为parts数组。
2. 我们从parts数组中移除并获取第一个属性键。
3. 我们尝试从当前对象中获取该键的值。
4. 如果值存在，并且还有更多的路径部分要遍历，我们递归地调用get函数。否则，返回当前的值或默认值。

使用示例

使用上面的user对象为例：

console.log(get(user, "profile.name.first", "Unknown"));  // 输出: John
console.log(get(user, "profile.age", 30));  // 输出: 30 (因为user.profile.age不存在，所以返回默认值)

总结

get函数为我们提供了一个强大而简洁的工具，使我们能够安全、有效地访问对象的深层属性，而不必担心遇到运行时错误。在日常开发中，这种功能可以极大地提高代码的稳健性和可读性。