JavaScript低版本环境下可选链操作符的最佳替代方案是什么？

原有使用可选链的代码在Node 12及以上版本可正常运行，12以下版本因未实现可选链语法会抛出运行错误，原代码如下：

const age = data.student?.age ? data.student.age: '';

多层if嵌套判断是最基础的兼容写法，但可读性和复用性较差，示例写法如下：

function checkAge(data){
  if(data && data.student && data.student.age) {
    return data.student.age;
  } else {
   return '';
  }
}

const age  = checkAge(data);

可选的更优替代方案 #

• 单行短路写法（单场景快速兼容）
  利用&&逻辑运算符的短路特性实现层级判断，无需额外封装函数，逻辑和原可选链代码完全一致，兼容所有已发布的Node.js版本：

  const age = data && data.student && data.student.age ? data.student.age : '';
  

  注意：该写法默认对最终值做真值判断，当age为0、''这类合法假值时会错误返回默认空串。如果业务中age可能取假值，需要把判断条件调整为非null/undefined校验：

  // 只要属性链路存在，无论age是0还是空串都正常返回
  const age = data && data.student && data.student.age != null ? data.student.age : '';
  

• 通用深层取值函数（多属性复用场景）
  如果项目中存在大量深层属性取值需求，可以封装一个通用的按路径取值工具函数，避免重复写长串&&判断：

  function getDeepValue(obj, pathStr, defaultValue = '') {
    const keyPath = pathStr.split('.');
    let current = obj;
    for (const key of keyPath) {
      if (current == null) return defaultValue;
      current = current[key];
    }
    return current == null ? defaultValue : current;
  }
  
  // 调用方式简洁，后续其他深层取值也可以复用
  const age = getDeepValue(data, 'student.age', '');
  

• 工程化语法降级（长期维护项目推荐）
  不需要修改现有可选链代码，直接在构建流程中接入Babel，引入@babel/plugin-proposal-optional-chaining插件，编译阶段会自动把可选链、空值合并等高版本ES语法转换为低版本兼容的ES5代码，开发阶段可以无负担使用新语法，不需要手动写兼容逻辑。

内容的提问来源于stack exchange，提问作者Sha