Вивчайте Доступ до Властивостей Об'єкта в JavaScript

Ми розглянемо два способи доступу до властивостей об'єкта: нотація через крапку та квадратні дужки. Ці методи дозволяють отримувати конкретні значення з об'єктів, і ми обговоримо ситуації, в яких кожен із них використовується найчастіше.

Нотація через крапку для доступу до властивостей

Основний і найчастіше використовуваний спосіб доступу до властивостей об'єкта — це нотація через крапку. За цим підходом ми звертаємося до властивості, вказуючи ім'я об'єкта, крапку та ім'я властивості.

Розглянемо приклад, де ми використовуємо об'єкт для представлення працівника та отримуємо його властивості за допомогою нотації через крапку:


              1234567891011
            
const employee = {
  companyName: "Schuster, Mertz and Marks",
  name: "Miss Alma Boyer",
  address: "2277 Karine Plains",
  workedYears: 4,
  remote: false,
};

console.log(employee.name); // Output: Miss Alma Boyer
console.log(employee.address); // Output: 2277 Karine Plains
console.log(employee.lastName); // Output: undefined

Примітка

Якщо спробувати отримати доступ до властивості, якої не існує, JavaScript поверне undefined;

undefined не виводиться при виконанні коду.

Доступ до властивостей через квадратні дужки

Другий спосіб отримання доступу до властивостей об'єкта — використання квадратних дужок. Цей синтаксис передбачає вказання імені об'єкта, після якого йдуть квадратні дужки з ім'ям властивості у вигляді рядка всередині них.

Цей підхід використовується рідше, ніж точкова нотація, але є необхідним у випадках, коли ім'я властивості невідоме заздалегідь або зберігається у змінній, наприклад, у параметрі функції. Ось приклад із використанням того ж об'єкта employee:


              1234567891011
            
const employee = {
  companyName: "Schuster, Mertz and Marks",
  name: "Miss Alma Boyer",
  address: "2277 Karine Plains",
  workedYears: 4,
  remote: false,
};

console.log(employee["name"]); // Output: Miss Alma Boyer
console.log(employee["address"]); // Output: 2277 Karine Plains
console.log(employee["lastName"]); // Output: undefined

Цей метод використовує ім'я властивості у вигляді рядка у квадратних дужках. Це дозволяє динамічно отримувати доступ до властивостей, що може бути корисним при роботі зі складнішими даними.

Доступ до вкладених властивостей

Розглянемо, як отримати доступ до вкладених властивостей за допомогою нотації через крапку на наступному прикладі.

За допомогою нотації через крапку вказується шлях до потрібної властивості, розділений крапками. Розглянемо приклад з об'єктом course:


              1234567891011121314151617
            
const course = {
  courseName: "Applied Science",
  courseDuration: "48 hours",
  author: {
    position: "Nuclear Physicist",
    age: 43,
    name: {
      first: "Mattie",
      last: "Crooks",
    },
  },
};

console.log(course.author.position); // Output: Nuclear Physicist
console.log(course.author.age); // Output: 43
console.log(course.author.name.first); // Output: Mattie
console.log(course.author.name.last); // Output: Crooks

У цьому прикладі здійснюється доступ до властивостей на різних рівнях вкладеності в об'єкті product.

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 2. Розділ 5

Запитати АІ

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Suggested prompts:

Can you explain when to use dot notation versus square brackets?

What happens if I try to access a deeply nested property that doesn't exist?

Can you show more examples of dynamic property access with variables?

Awesome!

Completion rate improved to 2.27

Свайпніть щоб показати меню

Нотація через крапку для доступу до властивостей


              1234567891011
            
const employee = {
  companyName: "Schuster, Mertz and Marks",
  name: "Miss Alma Boyer",
  address: "2277 Karine Plains",
  workedYears: 4,
  remote: false,
};

console.log(employee.name); // Output: Miss Alma Boyer
console.log(employee.address); // Output: 2277 Karine Plains
console.log(employee.lastName); // Output: undefined

Примітка

Якщо спробувати отримати доступ до властивості, якої не існує, JavaScript поверне undefined;

undefined не виводиться при виконанні коду.

Доступ до властивостей через квадратні дужки


              1234567891011
            
const employee = {
  companyName: "Schuster, Mertz and Marks",
  name: "Miss Alma Boyer",
  address: "2277 Karine Plains",
  workedYears: 4,
  remote: false,
};

console.log(employee["name"]); // Output: Miss Alma Boyer
console.log(employee["address"]); // Output: 2277 Karine Plains
console.log(employee["lastName"]); // Output: undefined

Доступ до вкладених властивостей


              1234567891011121314151617
            
const course = {
  courseName: "Applied Science",
  courseDuration: "48 hours",
  author: {
    position: "Nuclear Physicist",
    age: 43,
    name: {
      first: "Mattie",
      last: "Crooks",
    },
  },
};

console.log(course.author.position); // Output: Nuclear Physicist
console.log(course.author.age); // Output: 43
console.log(course.author.name.first); // Output: Mattie
console.log(course.author.name.last); // Output: Crooks

У цьому прикладі здійснюється доступ до властивостей на різних рівнях вкладеності в об'єкті product.

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 2. Розділ 5

Доступ до Властивостей Об'єкта в JavaScript

Нотація через крапку для доступу до властивостей

Доступ до властивостей через квадратні дужки

Доступ до вкладених властивостей

1. Які існують способи доступу до властивостей об'єкта?

2. Що повертається при використанні нотації крапки для доступу до властивостей об'єкта, якщо ви намагаєтеся отримати доступ до властивості, яка не існує?

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта `person`? Оберіть усі можливі варіанти.

Awesome!

Доступ до Властивостей Об'єкта в JavaScript

Нотація через крапку для доступу до властивостей

Доступ до властивостей через квадратні дужки

Доступ до вкладених властивостей

1. Які існують способи доступу до властивостей об'єкта?

2. Що повертається при використанні нотації крапки для доступу до властивостей об'єкта, якщо ви намагаєтеся отримати доступ до властивості, яка не існує?

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта `person`? Оберіть усі можливі варіанти.

Доступ до Властивостей Об'єкта в JavaScript

Нотація через крапку для доступу до властивостей

Доступ до властивостей через квадратні дужки

Доступ до вкладених властивостей

1. Які існують способи доступу до властивостей об'єкта?

2. Що повертається при використанні нотації крапки для доступу до властивостей об'єкта, якщо ви намагаєтеся отримати доступ до властивості, яка не існує?

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта person? Оберіть усі можливі варіанти.

Awesome!

Доступ до Властивостей Об'єкта в JavaScript

Нотація через крапку для доступу до властивостей

Доступ до властивостей через квадратні дужки

Доступ до вкладених властивостей

1. Які існують способи доступу до властивостей об'єкта?

2. Що повертається при використанні нотації крапки для доступу до властивостей об'єкта, якщо ви намагаєтеся отримати доступ до властивості, яка не існує?

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта person? Оберіть усі можливі варіанти.

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта `person`? Оберіть усі можливі варіанти.

3. Розгляньте наступний складний об'єкт, що представляє контактну інформацію особи. Як можна отримати поштовий індекс з об'єкта `person`? Оберіть усі можливі варіанти.