js 中常用的判空写法

在JavaScript中，判空通常是为了避免null或undefined值导致的错误。以下是一些常用的判空写法：

1.普通变量

let value = ...;
if (value === null || value === undefined) {
    // value 是 null 或 undefined
}

2.String

let str = ...;
if (!str || str.length === 0) {
    // str 是 null、undefined 或空字符串
}

3.Object

let obj = ...;
if (!obj || Object.keys(obj).length === 0) {
    // obj 是 null、undefined 或空对象
}

4.Array

let array = ...;
if (!array || array.length === 0) {
    // array 是 null、undefined 或空数组
}

5.Function

let func = ...;
if (typeof func === 'function') {
    // func 是一个函数
} else {
    // func 不是函数，可能是 null、undefined 或其他类型
}

6.使用 ?. 操作符（可选链）

let obj = ...;
let value = obj?.property;
// 如果 obj 是 null 或 undefined，value 将是 undefined

7.使用 ?? 操作符（空值合并运算符）

let value = ...;
let defaultValue = value ?? 'default';
// 如果 value 是 null 或 undefined，defaultValue 将是 'default'

8.使用 || 操作符（逻辑或运算符）

let value = ...;
let defaultValue = value || 'default';
// 如果 value 是 null、undefined 或假值（如 0、''、false），defaultValue 将是 'default'

9.使用 ?.() 调用函数（可选链调用）

let func = ...;
let result = func?.();
// 如果 func 是 null 或 undefined，result 将是 undefined

10.使用 ?.[] 访问属性（可选链访问）

let obj = ...;
let value = obj?.['property'];
// 如果 obj 是 null 或 undefined，value 将是 undefined

在JavaScript中，null 和 undefined 是两个不同的概念，但在大多数情况下，你可以将它们视为可互换的，因为它们都表示“没有值”。然而，在某些情况下，你可能需要区分它们。例如，在使用 === 进行严格比较时，null 和 undefined 是不相等的。

共通Function

根据以上的判空写法，我们可以抽出一个通用的判空方法，这个方法可以检查一个值是否为 null、undefined 或者是空（对于字符串和数组而言）。在JavaScript中，这通常通过以下方式实现：

function isEmpty(value) {
    if (value === null || value === undefined) {
        return true;
    }

    if (typeof value === 'string' && value.trim() === '') {
        return true;
    }

    if (Array.isArray(value) && value.length === 0) {
        return true;
    }

    if (value instanceof Object && Object.keys(value).length === 0) {
        return true;
    }

    return false;
}

这个 isEmpty 函数会根据值的类型进行不同的空检查：

• 对于 null 或 undefined，直接返回 true。
• 对于字符串，去除首尾空格后检查是否为空字符串。
• 对于数组，检查其长度是否为0。
• 对于对象，检查其拥有的键的数量是否为0。

请注意，这个函数不会检查函数类型是否为空，因为函数在JavaScript中是不可空的（即函数本身总是有一个值，即使这个值是 undefined）。如果你想要检查一个值是否是一个函数，你可以使用 typeof 操作符：

if (typeof value === 'function') {
    // value 是一个函数
}

同样，这个 isEmpty 函数也不会检查 Map、Set 或其他可能为空的数据结构。对于这些数据结构，你可能需要编写更具体的检查方法。

补全共通方法

isEmpty 函数我之前提供的方法并不适用于所有数据类型，它主要是针对一些常见的数据类型（如字符串、数组、对象）进行了检查。对于其他数据类型（如Map、Set、Function等）和特殊情形（如空对象与空数组），它可能不会返回正确的结果。

为了创建一个更通用的 isEmpty 函数，我们需要考虑更多的数据类型和情形。下面是一个更全面的实现，它包括了更多的数据类型和特殊情况的处理：

function isEmpty(value) {
    // Check for null or undefined
    if (value == null) return true;

    // Check for empty string
    if (typeof value === 'string' && value.trim() === '') return true;

    // Check for empty array
    if (Array.isArray(value) && value.length === 0) return true;

    // Check for empty object
    if (value instanceof Object && Object.keys(value).length === 0) return true;

    // Check for empty Map
    if (value instanceof Map && value.size === 0) return true;

    // Check for empty Set
    if (value instanceof Set && value.size === 0) return true;

    // Check for empty Function (technically functions are never empty, but we can check if it's the default function)
    if (typeof value === 'function' && value.toString() === 'function () {}') return true;

    // Check for empty Blob (e.g., new Blob([]))
    if (value instanceof Blob && value.size === 0) return true;

    // Check for empty File
    if (value instanceof File && value.size === 0) return true;

    // Check for empty FormData
    if (value instanceof FormData && value.keys().next().done) return true;

    // Check for empty ArrayBuffer
    if (value instanceof ArrayBuffer && value.byteLength === 0) return true;

    // Check for other possible empty types or custom checks
    // ...

    return false;
}

这个 isEmpty 函数包括了更多的数据类型检查，并且对于函数，它检查了函数的字符串表示是否为默认的空函数。这并不是一个完美的解决方案，因为函数的字符串表示可能会因不同的JavaScript引擎而异，但它在许多情况下应该足够使用。

请注意，这个函数仍然可能不涵盖所有可能的空检查情况，特别是对于自定义对象和复杂的嵌套数据结构。对于这些情况，你可能需要根据具体的需求来实现更专门的空检查逻辑。