Скобочная нотация в Javascript

Вычисляемые свойства объекта в Javascript

Аватар пользователя Olga Pejenkova
Olga Pejenkova
25 мая 2023

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

const user = { username: 'Ivan', type: 'admin' };

let propertyName = 'username';
user[propertyName]; // 'Ivan'

propertyName = 'type';
user[propertyName]; // 'admin'

В ES6/ECMAScript 2015 также добавилась возможность указывать вычисляемые имена свойств в момент создания объекта. До появления вычисляемых имен свойств нужно было сначала создать объект, а затем использовать запись в квадратных скобках, чтобы присвоить это свойство значению. Например, создаем пользователя:

const key = 'name';
const value = 'Vasya';

const user = {};
user[key] = value;

console.log(user.name); // Vasya

В примере выше мы сначала создаем объект user, и только потом назначаем выражение в качестве имени. С появлением вычисляемых имен свойств необходимости в этом шаге нет, и имя свойства вычисляется сразу в момент создания объекта:

const key = 'name';
const value = 'Vasya';

const user = {
    [key]: value
};

console.log(user.name); // Vasya

Используя вычисляемые свойства, можно также производить какие-либо действия над ключами. Выражение, указанное с скобках, будет вычислено и использовано в качестве имени свойства. Например, добавим цифру к имени поля при создании пользователя:

const key = 'name';
const value = 'Vasya';

const user = {
    [key + '25']: value
};

console.log(user); // { name25: 'Vasya'}
console.log(user.name25); // 'Vasya'
14 0
Основы Frontend за 14 дней
  • 72 урока в онлайн-тренажере
  • 4 живых вебинара и масскодинг
  • Помощь наставника на весь период обучения

Есть что добавить? Зарегистрируйтесь

или войдите в аккаунт

Отправляя форму, вы принимаете «Соглашение об обработке персональных данных» и условия «Оферты», а также соглашаетесь с «Условиями использования»

Курсы по программированию в Хекслете

Backend-разработка

Разработка серверной части сайтов и веб-приложений

Frontend-разработка

Разработка внешнего интерфейса сайтов и веб-приложений и верстка

Создание сайтов

Разработка сайтов и веб-приложений на JS, Python, Java, PHP и Ruby on Rails

Тестирование

Ручное тестирование и автоматизированное тестирование на JS, Python, Java и PHP

Аналитика данных

Сбор, анализ и интерпретация данных на Python

Интенсивные курсы

Интенсивное обучение для продолжающих

DevOps

Автоматизация настройки локального окружения и серверов, развертывания и деплоя

Веб-разработка

Разработка, верстка и деплой сайтов и веб-приложений, трудоустройство для разработчиков

Математика для программистов

Обучение разделам математики, которые будут полезны при изучении программирования

JavaScript

Разработка сайтов и веб-приложений и автоматизированное тестирование на JS

Python

Веб-разработка, автоматическое тестирование и аналитика данных на Python

Java

Веб-разработка и автоматическое тестирование на Java

PHP

Веб-разработка и автоматическое тестирование на PHP

Ruby

Разработка сайтов и веб-приложений на Ruby on Rails

Go

Курсы по веб-разработке на языке Go

HTML

Современная верстка с помощью HTML и CSS

SQL

Проектирование базы данных, выполнение SQL-запросов и изучение реляционных СУБД

Git

Система управления версиями Git, регулярные выражения и основы командой строки