Что такое объекты в JS?

Объекты в JavaScript

Объект — это фундаментальная структура данных в JavaScript. Это набор пар ключ-значение (свойства и методы), заключённые в фигурные скобки {}.

Основные концепции

Объект в JS — это:

• Набор свойств — пары ключ-значение
• Неупорядоченная коллекция — порядок свойств не гарантирован (кроме строковых ключей)
• Ссылочный тип данных — передаётся по ссылке, не по значению
• Основа для OOP — в JS "классы" - это синтаксический сахар над объектами

Создание объектов

1. Объектный литерал

// Простейший способ
const person = {
  name: 'John',
  age: 30,
  isActive: true
};

// Пустой объект
const empty = {};

// С методами
const car = {
  brand: 'Toyota',
  year: 2023,
  start() {
    console.log('Car started');
  },
  getInfo() {
    return `${this.brand} ${this.year}`;
  }
};

car.start();           // 'Car started'
console.log(car.getInfo()); // 'Toyota 2023'

2. Конструктор Object

const person = new Object();
person.name = 'John';
person.age = 30;

// Эквивалентно:
const person = { name: 'John', age: 30 };

3. Функция-конструктор

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.greet = function() {
    return `Hello, I'm ${this.name}`;
  };
}

const john = new Person('John', 30);
console.log(john.greet()); // 'Hello, I'm John'

4. Object.create()

const proto = {
  greet() {
    return `Hello, ${this.name}`;
  }
};

const person = Object.create(proto);
person.name = 'John';
console.log(person.greet()); // 'Hello, John'

Работа со свойствами

Доступ к свойствам

const person = { name: 'John', age: 30 };

// Через точку
console.log(person.name);  // 'John'

// Через квадратные скобки
console.log(person['name']);  // 'John'

// Полезно для динамических ключей
const key = 'age';
console.log(person[key]);  // 30

Добавление и удаление свойств

const obj = {};

// Добавление
obj.name = 'John';
obj['age'] = 30;

// Удаление
delete obj.age;

// Проверка наличия свойства
if ('name' in obj) {
  console.log('name exists');
}

if (obj.hasOwnProperty('name')) {
  console.log('name is own property');
}

Изменение свойств

const person = { name: 'John', age: 30 };

person.name = 'Jane';
person['age'] = 25;

console.log(person); // { name: 'Jane', age: 25 }

Методы объектов

Методы — это функции, которые являются свойствами объекта:

const person = {
  name: 'John',
  age: 30,
  greet: function() {
    console.log(`Hello, I'm ${this.name}`);
  },
  // Короткая запись метода (ES6)
  getAge() {
    return this.age;
  }
};

person.greet();      // 'Hello, I'm John'
console.log(person.getAge()); // 30

This контекст

this указывает на объект, который вызывает метод:

const person = {
  name: 'John',
  greet() {
    console.log(this);     // { name: 'John', greet: [Function] }
    console.log(this.name); // 'John'
  }
};

person.greet();

// Но если присвоить метод переменной:
const greet = person.greet;
greet();  // this будет undefined (в strict mode) или window (в браузере)

// Решение - bind:
const boundGreet = person.greet.bind(person);
boundGreet(); // Работает правильно

Встроенные методы Object

Object.keys() — получить ключи

const person = { name: 'John', age: 30, active: true };

const keys = Object.keys(person);
console.log(keys); // ['name', 'age', 'active']

// Итерация
keys.forEach(key => {
  console.log(`${key}: ${person[key]}`);
});

Object.values() — получить значения

const values = Object.values(person);
console.log(values); // ['John', 30, true]

Object.entries() — получить пары ключ-значение

const entries = Object.entries(person);
console.log(entries);
// [['name', 'John'], ['age', 30], ['active', true]]

// Удобно для итерации
Object.entries(person).forEach(([key, value]) => {
  console.log(`${key}: ${value}`);
});

Object.assign() — объединение объектов

const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };
const obj3 = { b: 99 };

const merged = Object.assign({}, obj1, obj2, obj3);
console.log(merged); // { a: 1, b: 99, c: 3, d: 4 }

// Или спред оператор (современный подход)
const merged2 = { ...obj1, ...obj2, ...obj3 };

Object.freeze() — заморозка объекта

const person = { name: 'John' };
Object.freeze(person);

person.name = 'Jane'; // Не срабатывает в strict mode
console.log(person.name); // 'John'

Прототипы и наследование

Все объекты наследуют от прототипа:

const person = {
  greet() {
    return `Hello, ${this.name}`;
  }
};

// Создаём объект с прототипом person
const john = Object.create(person);
john.name = 'John';

console.log(john.greet()); // 'Hello, John'

// greet находится в прототипе, а не в john
console.log(john.hasOwnProperty('greet')); // false
console.log('greet' in john); // true (с прототипом)

Деструктуризация объектов

const person = { name: 'John', age: 30, city: 'NYC' };

// Базовая деструктуризация
const { name, age } = person;
console.log(name); // 'John'
console.log(age);  // 30

// С переименованием
const { name: fullName, age: years } = person;

// С дефолтными значениями
const { name, country = 'USA' } = person;

// Вложенная деструктуризация
const data = {
  user: { name: 'John', address: { city: 'NYC' } }
};
const { user: { address: { city } } } = data;
console.log(city); // 'NYC'

Практические примеры

Конфигурационный объект

const config = {
  apiUrl: 'https://api.example.com',
  timeout: 5000,
  retries: 3,
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer token'
  }
};

const { apiUrl, timeout } = config;

Работа с данными из API

const users = [
  { id: 1, name: 'John', role: 'admin' },
  { id: 2, name: 'Jane', role: 'user' }
];

// Фильтрация
const admins = users.filter(user => user.role === 'admin');

// Трансформация
const names = users.map(user => user.name);

// Поиск
const john = users.find(user => user.name === 'John');

Объект vs Map

// Объект - старый способ
const obj = { name: 'John', age: 30 };

// Map - современный способ для хранения пар ключ-значение
const map = new Map();
map.set('name', 'John');
map.set('age', 30);

// Map удобнее для:
// - Любых типов ключей (не только строк)
// - Операций .size
// - Итерации
for (const [key, value] of map) {
  console.log(`${key}: ${value}`);
}

Заключение

Объекты в JavaScript — основа языка. Они используются для:

• Хранения данных — структурированная информация
• Создания абстракций — классы и компоненты
• Организации кода — модули, конфигурации
• Работы с API — JSON это объекты

Понимание объектов критично для становления JavaScript разработчика.