vue知识点之Vue3判断变量，数组，对象是否为空

一、判断字符串变量

在 Vue 3 中，你可以使用 JavaScript 提供的常规方式来检查变量是否不为 null 和不为 undefined。你可以分别使用严格不等运算符 !== 来比较变量是否不为 null 和不为 undefined。以下是一个示例：

// 假设有一个变量
let variable = 'some value';
// 检查变量是否不为 null 和不为 undefined
if (variable !== null && variable !== undefined && variable.length > 0) {
    console.log('变量不为 null 且不为 undefined');
} else {
    console.log('变量为 null 或 undefined');
}

在这个示例中，如果 variable 不为 null 且不为 undefined，则打印 “变量不为 null 且不为 undefined”；否则打印 “变量为 null 或 undefined”。

☘️ 如果你需要同时检查变量是否既不为 null 也不为 undefined，可以使用 != null 来简化判断：

if (variable != null && variable.length > 0) {
　　console.log('变量不为 null 且不为 undefined');
} else {
　　console.log('变量为 null 或 undefined');
}

这样做可以同时检查变量是否不为 null 和不为 undefined，因为 != null 表示既不为 null 也不为 undefined。

二、判断对象

在 Vue 3 中，你可以使用常规的 JavaScript 方法来检查对象是否不为 null , undefined 和 { }。以下是一些常见的方法：

☘️ 使用严格相等运算符 !==：

if (myObject !== null && myObject !== undefined && (Object.keys(obj).length !== 0) ) {
　  // 对象不为 null 或 undefined
}

☘️ 使用 typeof 操作符：

if (typeof myObject !== 'undefined' && myObject !== null && (Object.keys(obj).length !== 0)) {
　　// 对象不为 null 或 undefined
}

❗️在Vue.js中，可以使用 Object.keys() 方法来判断对象是否为空。 Object.keys() 方法返回一个包含对象中所有属性名称的数组。如果对象为空，则该数组的长度为0。

三、判断响应式数组

在Vue 3中，ref函数用于创建响应式数据，而obj是一个响应式数组。要判断obj数组是否为空，我们可以使用value属性来访问其实际值并进行判断。

在JavaScript中，判断一个数组是否为空有多种方法。我们将详细介绍以下几种常用的方法：

☘️ 方法一：使用Array.isArray()方法

if (Array.isArray(obj.value) && obj.value.length === 0) {
　　// obj数组为空的处理逻辑
}

这种方法先使用Array.isArray()方法判断obj.value是否为数组，然后再通过obj.value.length判断数组是否为空。这样可以避免在obj.value不是数组的情况下引发错误。

☘️ 方法二：使用Array.prototype.some()方法

if (!obj.value.some(item => item)) {
　　// obj数组为空的处理逻辑
}

这种方法使用some()方法遍历数组的每个元素，并对每个元素进行判断。如果数组中没有任何元素满足条件（即都为false、undefined、null等假值），则数组被视为空数组。