मुख्य कंटेंट तक स्किप करें

Объекты

@serverSerrverlesskiy

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

Object

В этой статье рассмотрим самые базовые свойства объектов JavaScript, создание🏗️ и изменение, перечисление свойств.

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

Объекты в JavaScript как и объекты в реальной жизни (человек👨, автобус, здание и т.д.) имеют несколько именованных (ключевых🗝️) параметров (возраст, имя, цвет волос, статус) с конкреными значениями (15, John, black, 'true') ✅ :

let obj = {  age: 15,  name: 'John',  color: 'black',  student: true}

Метод объекта в JavaScript - это просто функция️, которая добавлена в ассоциативный массив.

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

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

Object

В компьютере🖥️ мы можем представить объект в виде шкафа📦 с подписанными на нём именами-свойствами (ключи доступа). Внутри шкафа📦 ящики🧰 - данные (конкретная информация) и даже могут быть более мелкие объекты, по аналогии вещи. По ключу нужный ящик🧰 легко найти, удалить или добавить (записать) в него новое значение.

obj01

Это два 2️⃣ варианта создания🏗️ пустого объекта:

// эквивалентные записиlet obj = {}let person = new Object()

Второй вариант очень редко используется в практике.

obj00

Расширенное создание#

Extended

Свойства можно указывать непосредственно при создании🏗️ объекта, через список в фигурных скобках вида {..., ключ : значение, ...} и создавать🏗️ сложные объекты:

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Созданый🏗️ объект содержит пять свойств с конкретными значениями, одно из которых паспортные данные, являющийся встроенным объектом. Обратите внимание, как идет обращение к дальним свойствам или методам объекта. Попробуйте вернуть номер паспорта.

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

Adding

Есть два 2️⃣ синтаксиса добавления свойств в объект. 1️⃣ Первый - точка, второй - квадратные скобки:

// эквивалентные записиobj.age = 15obj['age'] = 15
लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Квадратные скобки используются в основном, когда название свойства (properties) находится в переменной 🔔 :

let nameProp = 'age'obj[nameProp] = 15

Здесь через переменную 🔔 nameProp задаем имя свойства "age", являющийся ключом в ассоциативном массиве, по которому лежит значение 15.

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

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

Door

Доступ к свойству осуществляется при обращении к нему 👇 :

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Если у объекта нет такого свойства, то результат будет 'undefined'. Проверьте это в консоле браузера.

let obj = {}obj.nokey

nokey

Никакой ошибки🙅‍♂️ при обращении по несуществующему свойству не будет, просто вернется специальное значение undefined. При отсутствии внутри функции⚙️ ключевого 🗝️ слова return, так же вернется значение undefined - отсутствие чего-либо.

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

Delete

Удаляет ➖ свойство оператор delete. Попробуйте удалить из прошлого примера номер паспорта:

Создайте в консоле объект из прошлого примера.

const obj = {  age: 15,  name: 'John',  color: 'black',  passport: {    serial: 5721,    number: 258963,    date: '27.10.2015'  },  student: true}

А теперь удалите вложеный объект passport

delete obj.passport

Теперь если обратиться к нему, то в результате получим undefined

obj.passport

delete obj

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

Description

Как и в других языках👅, у объектов JavaScript есть методы.

Например, создадим🏗️ объект sport сразу с методом run:

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Добавление метода#

Add

Добавление метода в существющий объект - просто, присвоим функцию⚙️ function(n) { ... } свойству sport.run.

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

Здесь не идет речь о классах, создании🏗️ экземпляров и тому подобном. Просто - в любой объект в любое время можно добавить новый метод или удалить существующий.

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

enumeration

Для перебора всех свойств объекта используется специальный вид конструкции for .. in:

for(let key in obj) {  // key - название свойства  // obj[key] - значение свойства  ...}

Например 👇 :

लाइव एडिटर
परिणाम
SyntaxError: Unexpected token (1:8)
1 : return ()
            ^

И по секрету, если честно, практически любая переменная 🔔 является мини-объектом в среде JavaScript. Так, что не бойтесь их применять.

Проблемы?#

Problem

Пишите в Discord или телеграмм чат, а также подписывайтесь на наши новости

Вопросы#

Question

Пустой объект создается командой:

  1. let obj = {}
  2. function obj()
  3. let x = 10

Объект хранит соответствия:

  1. ключ : значение
  2. имя : фамилия
  3. переменная = значение

Синтаксиc присвоения значения конкретному ключу (свойству):

  1. color() = "green"
  2. obj.color = "red"
  3. function color () => "yellow"

Метод объекта в JavaScript - это

  1. Просто функция, добавленная в ассоциативный массив
  2. Внешняя функция
  3. Переменная описанная вне объекта

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

  1. for (let i = 0; i <= 100; i++) { sum += i }
  2. for(let key in obj) { }
  3. while (условие) { }

Для того чтобы понять, на сколько вы усвоили этот урок, пройдите тест в мобильном приложении нашей школы по этой теме.

Sumerian school

Ссылки:#

  1. MDN web doc. Developer.mozilla.org - Статья "Типы данных JavaScript и структуры данных"
  2. MDN web doc. Developer.mozilla.org - Статья "Инициализация объектов"
  3. Статья "Object Types"
  4. Статья "Объекты", сайт Learn.javascript.ru
  5. Код для подростков: прекрасное руководство по программированию для начинающих, том 1: Javascript - Jeremy Moritz

Contributors ✨#

Thanks goes to these wonderful people (emoji key):


Dmitriy K.

📖

Dmitriy Vasilev

💵

Resoner2005

🐛 🎨 🖋

Navernoss

🖋 🐛 🎨

Become a Patron!