Оператор in в JavaScript

• Что делает оператор in
• Синтаксис
• Проверка свойства в объекте
• undefined и наличие свойства
• Оператор in в условиях
• Оператор in и массивы
• Свойства из прототипа
• Итого

Оператор in проверяет, есть ли свойство в объекте. Если свойство есть, результатом будет true. Если свойства нет - false.

let user = {
  name: 'Анна',
  age: 25
};

console.log('name' in user);
console.log('email' in user);

Результат:

true
false

Свойство name есть в объекте user, а свойства email нет.

Что делает оператор in

Оператор in проверяет именно наличие свойства, а не его значение.

let user = {
  name: 'Анна'
};

console.log('name' in user);

Результат:

true

Можно читать так: есть ли свойство ‘name’ в объекте user?

Синтаксис

'propertyName' in object

Слева указывается имя свойства, справа - объект, в котором нужно выполнить проверку.

let student = {
  course: 'JavaScript'
};

console.log('course' in student);

Результат:

true

Имя свойства обычно записывают строкой. Если имя лежит в переменной, кавычки не нужны.

let key = 'course';

console.log(key in student);

Проверка свойства в объекте

in удобно использовать, когда нужно понять, есть ли в объекте нужное поле.

let student = {
  name: 'Иван',
  group: 'JS-1'
};

if ('group' in student) {
  console.log('Группа указана');
}

Если свойство group есть, код внутри if выполнится.

Оператор работает и со свойствами, в названии которых есть пробелы:

let student = {
  name: 'Иван',
  'work experience': 1
};

console.log('work experience' in student);

Результат:

true

undefined и наличие свойства

Иногда свойство есть, но его значение равно undefined.

let user = {
  name: 'Анна',
  email: undefined
};

console.log(user.email);
console.log('email' in user);

Результат:

undefined
true

Значение свойства email равно undefined, но само свойство в объекте есть. Поэтому оператор in возвращает true.

Если проверять только так, можно получить неточный вывод:

if (user.email === undefined) {
  console.log('Email не указан');
}

Такая проверка не отличает две ситуации: свойства нет вообще или свойство есть, но в нем лежит undefined.

Оператор in в условиях

Оператор in часто используют внутри if.

let settings = {
  theme: 'dark'
};

if ('theme' in settings) {
  console.log('Тема выбрана');
} else {
  console.log('Использовать тему по умолчанию');
}

Если свойство есть, выполняется первый блок. Если свойства нет - блок else.

Оператор in и массивы

С массивами in проверяет наличие индекса, а не значение внутри массива.

let colors = ['red', 'green'];

console.log(0 in colors);
console.log(1 in colors);
console.log(2 in colors);

Результат:

true
true
false

В массиве есть элементы с индексами 0 и 1, но нет элемента с индексом 2.

Если нужно проверить, есть ли в массиве значение, оператор in не подходит. Для этого обычно используют методы массивов, например includes().

console.log(colors.includes('red'));

Свойства из прототипа

Оператор in проверяет не только собственные свойства объекта, но и свойства из прототипа.

let user = {
  name: 'Анна'
};

console.log('name' in user);
console.log('toString' in user);

Результат:

true
true

Свойство name находится прямо в объекте. А toString приходит из прототипа, но оператор in все равно возвращает true.

На первых уроках чаще всего достаточно помнить простое правило: in отвечает на вопрос «есть ли такое свойство у объекта или в его цепочке прототипов».

Итого

Оператор in проверяет наличие свойства в объекте и возвращает true или false. Он полезен, когда нужно отличить отсутствующее свойство от свойства со значением undefined. С массивами in проверяет индексы, а не значения. Также важно не путать оператор in с циклом for…in: оператор проверяет наличие свойства, а цикл перебирает свойства объекта.