JavaScript: comprobar si un objeto está vacío

En este tutorial, aprenda cómo verificar si un objeto está vacío en JavaScript con Vanilla JS, jQuery, Lodash, Underscore, Ramda y Hoek, ¡con ejemplos prácticos de código!

Introducción

Los objetos se utilizan para almacenar una colección de propiedades, cada una de las cuales puede considerarse como una asociación entre un nombre (o clave) y un valor (una colección de pares clave-valor).

En esta guía, exploraremos muchos métodos de JavaScript sobre cómo verificar si un objeto está vacío. Usaremos Vanilla JavaScript, así como bibliotecas comunes como lodash y guion bajo.

Cuando se trata de aplicaciones pequeñas que no requieren dependencias externas, es mejor verificar si un objeto está vacío con JavaScript puro. Sin embargo, si su aplicación ya tiene bibliotecas externas como lodash y guión bajo, también ofrecen excelentes formas de realizar estas comprobaciones.

Comprobar si un objeto está vacío o no es una operación básica y frecuente, sin embargo, existen varios métodos para determinar si está vacío o no.

Comencemos creando un objeto vacío con la sintaxis literal del objeto:

1
const emptyObject = {}

Uso del método Object.keys()

Object.keys() es un método estático que devuelve un Array cuando le pasamos un objeto, que contiene los nombres de las propiedades (claves) que pertenecen a ese objeto. Podemos comprobar si la longitud de esta matriz es 0 o superior, lo que indica si hay claves presentes o no. Si no hay claves presentes, el objeto está vacío:

1
Object.keys(obj).length === 0 && obj.constructor === Object;

{.icon aria-hidden=“true”}

Nota: La verificación del constructor asegura que el argumento pasado sea de hecho un objeto.

También podríamos crear una función reutilizable, si está utilizando el cheque varias veces en el proyecto:

1
2
3
4
5
const isEmptyObject = (obj) => {
    return Object.keys(obj).length === 0 && obj.constructor === Object;
}

console.log(isEmptyObject(emptyObject)); // true

Este es, con mucho, el método más simple para determinar si un objeto está vacío, aunque es un poco detallado. Eliminaremos esta verbosidad con los siguientes enfoques, después de echar un vistazo a los métodos estáticos Object.values() y Object.entries(), que se pueden usar de la misma manera que Object.keys ().

Usando el método Object.values()

Al igual que con las claves, si un objeto no tiene valores asociados (ni siquiera undefined/null), está vacío:

1
2
3
4
5
const isEmptyObject = (obj) => {
    return Object.values(obj).length === 0 && obj.constructor === Object;
}

console.log(isEmptyObject(emptyObject)); // true
Uso del método Object.entries()

El método entries() representa todos los pares clave-valor (entradas), que se pueden usar como contenedor para los dos enfoques anteriores:

1
2
3
4
5
const isEmptyObject = (obj) => {
    return Object.entries(obj).length === 0 && obj.constructor === Object;
}

console.log(isEmptyObject(emptyObject)); // true

for...in and hasOwnProperty()

Para los navegadores que no son compatibles con los métodos keys(), values() y entries(), ¡puede recorrer explícitamente las propiedades! Puede envolver esta lógica dentro de un método que devuelve “verdadero” si no se encontraron propiedades, y “falso” si se encontraron propiedades:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
const isEmptyObject = (objectName) => {
    for (var prop in objectName) {
        if (objectName.hasOwnProperty(prop)) {
            return false;
        }
    }
    return true;
}

console.log(isEmptyObject(emptyObject)); // true

Usando JSON.stringify

Este es uno de los métodos más simples de usar. Cuando encadenamos un objeto y la salida es solo un paréntesis de apertura y cierre, sabemos que el elemento está vacío:

1
JSON.stringify(objectName) === '{}';

También podríamos envolvernos fácilmente en una función:

1
2
3
4
5
const isEmptyObject = (objectName) => {
    return JSON.stringify(objectName) === '{}';
}

console.log(isEmptyObject(emptyObject)); // true

Comprobar si el objeto está vacío con las bibliotecas de JavaScript

Las bibliotecas nos ayudan a escribir código más rápido, al incorporar funciones avanzadas, utilizadas y perfeccionadas por muchos otros desarrolladores, en lugar de escribir nuestras propias soluciones.

Las bibliotecas son comunes, generalmente rápidas/optimizadas, y algunas están presentes en muchos proyectos debido a su utilidad. Varios de ellos también se pueden utilizar para comprobar si un objeto está vacío o no. La mayoría de ellos ofrecen una excelente compatibilidad con navegadores más antiguos.

Usar guión bajo y Lodash

Tanto lodash como guión bajo son bibliotecas de utilidades que ofrecen bastantes utilidades comunes. Ambos se importan típicamente como _, y se pueden importar a través de un CDN:

1
2
<script src="https://cdn.jsdelivr.net/npm/[correo electrónico protegido]/lodash.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[correo electrónico protegido]/underscore-umd-min.js"></script>

O instaló un administrador de paquetes como NPM y luego lo importó a través de la sintaxis require ():

1
2
$ npm install lodash
$ npm install underscore
1
2
const _ = require('lodash');
const _ = require('underscore');

Ambas bibliotecas tienen exactamente la misma sintaxis para verificar si un objeto está vacío:

1
_.isEmpty();

Esta función funciona con cualquier estructura de datos: listas, arreglos, cadenas, objetos, etc. La función es un contenedor de la lógica que verifica la longitud del objeto que se pasó, devolviendo verdadero o falso:

1
_.isEmpty(emptyObject); // true
jQuery

jQuery es una biblioteca de JavaScript popular, presente en muchos proyectos en todo el mundo. Debido a su peso ligero y características que amplían el alcance de las capacidades integradas de JavaScript, se ha convertido en un elemento básico.

jQuery se puede importar a través de un CDN:

1
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

O instaló un administrador de paquetes como NPM y luego lo importó a través de la sintaxis require ():

1
$ npm install jquery

Normalmente se importa como $:

1
const $ = require('jquery');

Naturalmente, puede usarlo para verificar si un objeto está vacío o no:

1
$.isEmptyObject(emptyObject); // true
En el marco

Ramda es una biblioteca JavaScript funcional. Nunca muta los datos y admite la creación de canalizaciones puramente funcionales. Para aquellos con un fondo de programación más funcional, es una gran biblioteca con la que sentirse como en casa.

Ramda se puede importar a través de un CDN:

1
<script src="https://cdnjs.cloudflare.com/ajax/libs/ramda/0.28.0/ramda.min.js"></script>

O instaló un administrador de paquetes como NPM y luego lo importó a través de la sintaxis require ():

1
$ npm install ramda

Normalmente se importa como R:

1
const R = require('ramda');

Si ya lo estás usando, también ofrece una función isEmpty():

1
R.isEmpty(emptyObject); // true
Hoek

@hapi/hoek es parte del ecosistema hapi y una popular biblioteca de métodos de utilidad para aplicaciones basadas en hapi. Ofrece un método deepEqual(), que comprueba si dos objetos son iguales (en profundidad):

1
Hoek.deepEqual({}, emptyObject); // true

Conclusión

En este artículo, hemos analizado cómo verificar si un objeto está vacío o no en JavaScript. Con este fin, hemos utilizado varios enfoques de Vanilla JS, jQuery, Underscore, Lodash, Ramda, Hoek y el módulo JSON.