Объекты

Модуль 1: Web Core
18 уровень , 5 лекция
Открыта

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

Объекты являются одним из основных типов данных в JavaScript и широко используются для хранения и управления данными. Объект — это коллекция свойств, где каждое свойство состоит из ключа (имени) и значения. В этой лекции мы рассмотрим создание объектов, а также доступ к их свойствам и методам.

1. Литерал объекта

Литерал объекта в JavaScript – это способ создания объекта с использованием фигурных скобок {}. Этот метод позволяет создавать объект и одновременно задавать ему свойства и методы.

Литералы объектов часто используются из-за своей простоты и читаемости.

Самый распространенный способ создания объекта в JavaScript — использование литерала объекта.

В этом примере мы создали объект person с четырьмя свойствами: name, age, isStudent и greet.

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false,
        greet: function() {
          return 'Hello!';
        }
      };
    
  

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

Объекты также могут быть созданы с использованием конструктора Object().

Этот способ эквивалентен созданию объекта с использованием литерала объекта, но более многословен:

JavaScript
    
      let person = new Object();
      person.name = 'John';
      person.age = 30;
      person.isStudent = false;
      person.greet = function() {
        return 'Hello!';
      };
    
  

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

Функция-конструктор позволяет создавать несколько экземпляров объектов с одинаковыми свойствами и методами.

В этом примере функция-конструктор Person() используется для создания объектов john и jane с одинаковыми свойствами и методами:

JavaScript
    
      function Person(name, age, isStudent) {
        this.name = name;
        this.age = age;
        this.isStudent = isStudent;
        this.greet = function() {
          return 'Hello!';
        };
      }

      let john = new Person('John', 30, false);
      let jane = new Person('Jane', 25, true);
    
  

4. Метод Object.create()

Метод Object.create() создает новый объект с указанным прототипом и свойствами.

В этом примере объект john создается на основе прототипа personPrototype:

JavaScript
    
      let personPrototype = {
        greet: function() {
          return 'Hello!';
        }
      };

      let john = Object.create(personPrototype);
      john.name = 'John';
      john.age = 30;
      john.isStudent = false;
    
  

6.2 Доступ к свойствам и методам

1. Доступ с помощью точки

Самый распространенный способ доступа к свойствам и методам объекта — через точку:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        greet: function() {
          return 'Hello!';
        }
      };

      console.log(person.name);  // Выведет: John
      console.log(person.age);   // Выведет: 30
      console.log(person.greet()); // Выведет: Hello!
    
  

2. Доступ с помощью квадратных скобок

Свойства объекта также могут быть доступны с помощью квадратных скобок. Этот способ полезен, если имя свойства хранится в переменной или содержит пробелы или специальные символы:

JavaScript
    
      let person = {
        first name: 'John',
        age: 30,
        greet: function() {
          return 'Hello!';
        }
      };

      console.log(person['first name']); // Выведет: John
      console.log(person['age']);        // Выведет: 30

      let propertyName = 'greet';
      console.log(person[propertyName]()); // Выведет: Hello!
    
  

3. Изменение и добавление свойств

Свойства объекта могут быть изменены или добавлены в любое время:

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

      // Изменение существующего свойства
      person.age = 31;
      console.log(person.age); // Выведет: 31

      // Добавление нового свойства
      person.isStudent = false;
      console.log(person.isStudent); // Выведет: false
    
  

4. Удаление свойств

Свойства объекта могут быть удалены с помощью оператора delete:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false
      };

      delete person.isStudent;
      console.log(person.isStudent); // Выведет: undefined
    
  

6.3 Итерация по свойствам объекта

1. Цикл for...in

Цикл for...in позволяет перебирать все перечисляемые свойства объекта:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false
      };

      for (let key in person) {
        console.log(`${key}: ${person[key]}`);
      }

      // Выведет:
      // name: John
      // age: 30
      // isStudent: false
    
  

2. Метод Object.keys()

Метод Object.keys() возвращает массив всех перечисляемых ключей объекта:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false
      };

      let keys = Object.keys(person);
      console.log(keys); // Выведет: ['name', 'age', 'isStudent']
    
  

3. Метод Object.values()

Метод Object.values() возвращает массив значений всех перечисляемых свойств объекта:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false
      };

      let values = Object.values(person);

      console.log(values); // Выведет: ['John', 30, false]
    
  

4. Метод Object.entries()

Метод Object.entries() возвращает массив пар [ключ, значение] для всех перечисляемых свойств объекта:

JavaScript
    
      let person = {
        name: 'John',
        age: 30,
        isStudent: false
      };

      let entries = Object.entries(person);

      console.log(entries); // Выведет: [['name', 'John'], ['age', 30], ['isStudent', false]]
    
  

6.4 Проверка наличия свойств

1. Оператор in

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

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

      console.log('name' in person); // Выведет: true
      console.log('isStudent' in person); // Выведет: false
    
  

2. Метод hasOwnProperty()

Метод hasOwnProperty() проверяет, есть ли у объекта указанное свойство как его собственное (не унаследованное):

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

      console.log(person.hasOwnProperty('name')); // Выведет: true
      console.log(person.hasOwnProperty('isStudent')); // Выведет: false
    
  
1
Задача
Модуль 1: Web Core, 18 уровень, 5 лекция
Недоступна
Свойства объекта
Свойства объекта
1
Задача
Модуль 1: Web Core, 18 уровень, 5 лекция
Недоступна
Изменение свойств
Изменение свойств
Комментарии (3)
ЧТОБЫ ПОСМОТРЕТЬ ВСЕ КОММЕНТАРИИ ИЛИ ОСТАВИТЬ КОММЕНТАРИЙ,
ПЕРЕЙДИТЕ В ПОЛНУЮ ВЕРСИЮ
Анастасия Уровень 34
12 августа 2025
В примере 4. Метод Object.create() - вообще ничего не рассказывается об данном методе создания. Вот например в примере создается объект с привязанной функцией, которую мы прописали в прототипе. Хотя сначала думала где же это будет в параметрах, но это не парамерт, а функция, как оказалось. Вызывается вот так - john1.greet() Дополнитель можно почитать в доке - https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Object/create Так еж вот статейка, которая ставит всё на свои места(там примерчики, чтобы понимать как её можно применять) - https://metanit.com/web/javascript/4.19.php Вообще метод довольно полезный, как оказалось (после прочтения статьи, надеюсь я правитльно поняла материял) - можно копировать свойства из другого объекта (унаследовать) + можно прописывать какие-либо функции объекту + можно сразу в него передать значения определенных полей (причем там существуют дополнительные настройки полей - можно ли их изменять, или они только для чтения, можно прописывать геттер и сеттер, если вы не знакомы с этими понятиями - геттер(get - getter) - это функция которая срабатывает, когда мы хотим вытащить переменную на чтение, сеттер(set - setter) - эта функция которая срабатывает, когда мы хотим сохранить значение в переменную, т.е. запись)
Анастасия Уровень 34
12 августа 2025
Пример 2. Доступ с помощью квадратных скобок который представлен - вообще не рабочий, чтобы он сработал, надо обернуть название переменной в кавычки, иначе вылетает ошибка, даже в примере на сайте

let person3 = {
    'first name': 'John',
    age: 30,
    greet: function() {
        return 'Hello!';
    }
};

console.log(person3['first name']); // Выведет: John
Анастасия Уровень 34
12 августа 2025
В первом задании нужно использовать this, хотя мы его не проходили... Хотя вскользь уже пару раз было затронуто, странно...