如何正确校验仅含__proto__、__ob__属性的Vue对象是否为空

核心思路 #

封装通用的空对象判断函数，过滤掉__ob__这类框架注入的非业务属性、以及原型链上的__proto__属性，仅判断业务自定义属性是否为空，避免每次手动校验内部属性。

实现代码 #

基础版 #

/**
 * 校验对象是否仅包含内置非业务属性
 * @param {any} obj 待判断的对象
 * @returns {boolean} 是空对象返回true，否则返回false
 */
function isEmptyObject(obj) {
  // 排除非对象、null的情况
  if (typeof obj !== 'object' || obj === null) {
    return true
  }
  // 获取所有自身属性（自动排除原型链上的__proto__属性）
  const selfKeys = Object.getOwnPropertyNames(obj)
  // 过滤Vue等框架注入的__ob__响应式属性
  const businessKeys = selfKeys.filter(key => key !== '__ob__')
  return businessKeys.length === 0
}

兼容Symbol属性的增强版 #

如果业务中会用到Symbol类型作为属性名，可使用Reflect.ownKeys获取所有类型的自身属性，判断逻辑更严谨：

function isEmptyObject(obj) {
  if (typeof obj !== 'object' || obj === null) {
    return true
  }
  const allSelfKeys = Reflect.ownKeys(obj)
  const businessKeys = allSelfKeys.filter(key => key !== '__ob__')
  return businessKeys.length === 0
}

调用方式 #

封装完成后，你可以直接使用三元表达式实现需求，不需要每次手动校验内部属性：

const myObject = isEmptyObject(objectFromDb) ? mockObject : objectFromDb

如果需要频繁使用该逻辑，还可以进一步封装为取值工具函数，简化调用：

function getOrDefault(target, fallback) {
  return isEmptyObject(target) ? fallback : target
}

// 直接调用即可
const myObject = getOrDefault(objectFromDb, mockObject)

原理解释 #

• Object.getOwnPropertyNames/Reflect.ownKeys仅获取对象自身的属性，原型链上的__proto__不会被纳入统计，不需要额外过滤
• 手动排除__ob__这类框架自动注入的非业务属性，即可准确判断对象是否包含有效业务属性
• 原生的||运算符会把空对象判定为真值，因此无法直接用于该场景，必须配合自定义判断逻辑使用

内容的提问来源于stack exchange，提问作者Håkon