Эту задачу можно решить, как с помощью сторонних библиотек, так и на нативном языке. Проверить объект на пустоту на JavaScript (js) можно при помощи метода Object.keys().
Проверка объектов на пустоту в JavaScript
В принципе, для нативного js достаточно использовать новый метод Object.keys().
const empty = {};
Object.keys(empty).length === 0 && empty.constructor === Object;
Для чего необходима дополнительная проверка конструктора? В JavaScript имеется девять встроенных конструкторов.
new Object();
new String();
new Number();
new Boolean();
new Array();
new RegExp();
new Function();
new Date();
Мы можем создать пустой объект с помощью new Object(), но стоит отметить, что:
Никогда не следует создавать объект с помощью конструктора. Это считается плохой практикой.
const obj = new Object();
Object.keys(obj).length === 0; // true
При обычном использовании Object.keys() он возвращает true, если объект пуст. Но что происходит, когда мы создаем новый экземпляр объекта с помощью других вышеуказанных конструкторов.
function badEmptyCheck(value) {
return Object.keys(value).length === 0;
}
badEmptyCheck(new String()); // true
badEmptyCheck(new Number()); // true
badEmptyCheck(new Boolean()); // true
badEmptyCheck(new Array()); // true
badEmptyCheck(new RegExp()); // true
badEmptyCheck(new Function()); // true
badEmptyCheck(new Date()); // true
Строго говоря, такая попытка проверить объект на пустоту в JavaScript выдает ложное срабатывание true.
Решение проблемы ложных срабатываний
Для того, чтобы легко исправить это, следует добавить проверку конструктора.
function goodEmptyCheck(value) {
Object.keys(value).length === 0 && value.constructor === Object; // Проверка конструктора
}
goodEmptyCheck(new String()); // false
goodEmptyCheck(new Number()); // false
goodEmptyCheck(new Boolean()); // false
goodEmptyCheck(new Array()); // false
goodEmptyCheck(new RegExp()); // false
goodEmptyCheck(new Function()); // false
goodEmptyCheck(new Date()); // false
Отлично! Теперь мы получили верный ответ.
Как проверить объект на пустоту в JavaScript при других значениях
Давайте протестируем этот метод с некоторыми другими значениями.
function isEmptyObject(value) {
return Object.keys(value).length === 0 && value.constructor === Object;
}
Пока все выглядит хорошо. Для не объектов такой код возвращает false.
isEmptyObject(100); // false
isEmptyObject(true); // false
isEmptyObject([]); // false
Но с таким подходом следует быть осторожным! Такие значения вызовут ошибку.
Проверка объекта на null и undefined
Чтобы избежать ошибки TypeError можно применить дополнительную проверку.
let value;
value && Object.keys(value).length === 0 && value.constructor === Object;
// Проверка на null и undefined
value = null; // null
value = undefined; // undefined
В этом случае никаких ошибок возникать не будет.
Использование сторонних библиотек
Стоит отметить множество внешних библиотек, которые позволяют осуществить проверку объекта на пустоту в js.
Lodash
_.isEmpty({}); // true
Underscore
_.isEmpty({}); // true
jQuery
jQuery.isEmptyObject({}); // true
Читайте также: Клонирование элемента в JavaScript.
Чистый JavaScript или библиотеки
Что именно выбрать, зависит от обстоятельств. Я отдаю предпочтение нативному JavaScript и стараюсь использовать его всегда. Что ни говори, но подключение внешних библиотек не всегда оправдано и негативно сказывается на скорости загрузки сайтов и их работе. Да и изучать документацию и настраивать библиотеку для таких мелочей особого смысла тоже нет. Но если разрабатываемое приложение уже предполагает использование сторонних библиотек, то почему бы не задействовать их. В любом случае окончательный выбор того, как в JavaScript проверить объект на пустоту зависит от личных предпочтений каждого и конкретной задачи.
Прочие методы
for (let key in object) {
if (object.hasOwnProperty(key)) {
return false;
}
return true;
}
Кроссбраузерность
В общей сложности, на момент написания статьи метод Object.keys() получил полную поддержку браузеров, включая Internet Explorer.