Синтаксис вычисляемых свойств объекта Flashcards
Статические и динамические св-ва
Статические и динамические св-ва
Статические свойства - это такие свойства (Каждое свойство состоит из пары “ключ: значение”), значения которых известны заранее и могут быть установлены при создании объекта.
Вычисляемые (динамические) свойства - это такие свойства, значения которых могут зависеть от условий или вычисляться в процессе выполнения кода. Они определяются с использованием квадратных скобок и выражения внутри них.
Синтаксис состоит из использования квадратных скобок [] для определения свойств объекта. Внутри этих скобок может находиться любое выражение, которое будет вычислено, и результат будет использован в качестве имени свойства.
Статистическое св-во:
let obj = {
name: “Bob”, (св-ва, которая состоит из пары - ключ и значение) // статическое св-во
age: 55 //статическое св-во
};
Статическое св-во - заранее знаем св-во и оно никак не может быть изменено, т.е. не вычисляется, как обрабатывается код.
console.log(‘obj: ‘, obj) // obj: {name: ‘Bob’, age: 55}
function createObj (key, value) {
let newObj = {} - создаем новый объект
newObj[key] = value
return newObj
}
console.log(createObj(‘car’, ‘BMW’)) // {car: ‘BMW’}
Динамическая св-во:
function createObj2(key, value){
[key]: value
}
console.log(createObj2(‘car’, ‘Audi’)) // {car: ‘Audi’}
Если динамический способ, то на 1 месте ставятся [ключ] - внутри могут быть переменные, арифметические итерации и после пишется значение и в моменте, когда код или св-во вычисляется => на выходе получаем объект с каким-то св-ом и с каким-то определенным значением.
Вычисляем (динамически):
{
[вычисляем св-во]: зн-е
}
[] - передаем переменные, конкатенацию строк, арифметические операции, какие-либо другие выражения.
Ключи в объектах, только строка.
Пример 1:
let propertyName = “ status”
const obj1 = {
name: ‘John’, // статическое св-во
[propertyName]: ‘checked’, //динамическое (вычисляемое) св-во
}
console.log(‘obj1: ‘, obj1) // obj1: {name: ‘John’, status: ‘checked’}
Пример 2:
let prefix = ‘status_’,
const obj2 = {
age: 25, //статистическое св-во
[prefix + ‘id’]: ‘new member’ // динамическое св-во
}
console.log(‘obj2: ‘, obj2) // obj2: {‘age’: 25, ‘‘status_id”: ‘‘new member”}
Пример 3:
Обращаемся к св-ву только через квадратные скобки
let index = 2
let testProperty = ‘test’
let obj = {
[index + 2]: 4,
[testProperty.toUpperCase()] : ‘test key in upper case’
}
console.log(‘obj: ‘, obj) //obj: {‘4’: 4, TEST: ‘test key in upper case’}
Пример 4 (логистика - общая информация о статусах)
const STATUS_BUSY = ‘busy’,
const STATUS_READY = ‘ready’
const STATUS_LABELS = {
[STATUS_BUSY]: “ожидает”,
[STATUS_READY]: “готово”,
}
const drivers = [
{name: ‘Pavel’, status: ‘busy’},
{name: ‘Anna’, status: ‘ready’},
{name: ‘Kiryll’, status: ‘busy’},
]
const driverStatuses = drivers.map((driver) => {
const {status} = driver; - забираем статусы // деструктуризация
console.log(‘status: ‘, status); //busy, ready, busy
//const status = driver.status
return STATUS_LABELS[status]
})
console.log(‘driverStatuses: ‘, driverStatuses) //driverStatuses: [‘ожидает’, ‘готово’, ‘ожидает’]
Статические методы
Используем, если захотим промапиться)
Object.keys() - возвращает массив ключей - работает с первым уровнем вложенности.
Object.values() - возвращает массив значений - работает с первым уровнем вложенности.
Object.entries() - возвращает массив пар[ключ, значение] - работает с первым уровнем вложенности.
Object.keys() - возвращает массив ключей - работает с первым уровнем вложенности.
const driver = {name: ‘Pavel’, status: ‘busy’}
const result = Object.keys(driver)
console.log(result) // [‘name’, ‘status’]
!!!!! с вложенными, если мы хотим получить keys, то у нас не будут отражаться ключи с вложенностью.
const driver = {name: ‘Павел’. status: ‘busy’ , country: {id: 1}};
const result = Object.keys(driver);
console.log(result1); // [‘name’, ‘status’, ‘country’]
Если хотим получить все ключи, то их необходимо собирать рекурсивно, т.е каждый раз проходим по объекту и проверяем, есть ли какой-то ключ, если есть то добавляем какой-то массив и до той поры, пока не закончатся ключи в объекте.
Object.values() - возвращает массив значений - работает с первым уровнем вложенности.
const driver = {name: ‘Pavel’, status: ‘busy’}
const result = Object.values(driver)
console.log(result) // [‘Pavel’, ‘busy’]
!!!!! с вложенными, если мы хотим получить values, то у нас не будут отражаться значения с вложенностью.
const driver = {name: ‘Павел’, status: ‘busy’ , country: {id: 1}};
const result = Object.values(driver);
console.log(result) // [‘Павел’, ‘busy’, {id: 1}]
Object.entries() - возвращает массив пар[ключ, значение] - работает с первым уровнем вложенности.
const driver = {name: ‘Pavel’, status: ‘busy’}
const result = Object.entries(driver)
console.log(result); // [ [‘names’, ‘Pavel’], [‘status’, ‘busy’]]
!!!!! с вложенными, если мы хотим получить пару, то у нас не будут отражаться пары с вложенностью.
const driver = {name: ‘Павел’, status: ‘busy’ , country: {id: 1}};
const result = Object.entries(driver);
console.log(result) // [ [‘names’, ‘Павел’], [‘status’, ‘busy’], [‘country’, {id: 1}]]
Object.entries() часто используется для преобразования объекта в массив массивов, что удобно при работе с данными, например, для фильтрации или манипуляций с данными.
Map – это коллекция ключ/значение, как и Object.keys(). Но основное отличие в том, что Map позволяет использовать ключи любого типа.
Для собеседования!!!
new Map, new Set
new Map() - коллекция, которая представляет с собой пару ключ/значение. Ключи могут быть любого типа.
Редко используется и больше для интервью.
По сути реализация хэштаблицы, хэштейбл.
Признаки:
-итерабельность (может итерироваться, как массив)
- может быть, как функция и сложность операции, так как используется хэштаблица и вкл. уникальный индекс, происходит быстрое чтение данных.
Хеш-табли́ца — структура данных, реализующая интерфейс ассоциативного массива, а именно, она позволяет хранить пары (ключ, значение) и выполнять три операции: операцию добавления новой пары, операцию удаления и операцию поиска пары по ключу.
new Map() – создаёт коллекцию.
map.set(key, value) – записывает по ключу key значение value.
map.get(key) – возвращает значение по ключу или undefined, если ключ key отсутствует.
map.has(key) – возвращает true, если ключ key присутствует в коллекции, иначе false.
map.delete(key) – удаляет элемент (пару «ключ/значение») по ключу key.
map.clear() – очищает коллекцию от всех элементов.
map.size – возвращает текущее количество элементов.
let map = new Map() или let newMap = new Map([[‘key’, ‘value’], [1, ‘one’]]); т.е. передаем массив пар.
console.log(‘newMap’, newMap) //newMap Map(2) {‘key’ => ‘value’, 1 => one}
console.log(‘map ‘, map) // map: Map(0) {}
Так выглядит наша коллекция - в круглых скобках (0) у нас описывается количество элементов в коллекции.
{} - описываются наши элементы, когда мы что-то добавляем в коллекцию.
// Добавление в коллекцию:
map.set(‘1’, ‘first value number’);
map.set(1, ‘number’);
map.set(true, ‘boolean value’);
map.set([], ‘arr’)
map.set({}, ‘obj’)
console.log(map);
Map(5) {
‘1’ => ‘first value number’, ключ/значения
1 => ‘number’,
true => ‘boolean value’,
[] => ‘arr’,
{} => ‘obj’
}
}
Если задаем ключ массива или объекта - ссылочный тип данных, каждое значение будет уникальным. Используется чаще для хранения данных.
___________________________________________________________________
map.set(func, ‘function’);
console.log(get)
// Map(1) {[Function: func] => ‘function’}
const get = map.get(func);
console.log(get) //function
____________________________________________________________________
let map = new Map()
map.set(‘1’, ‘first value number’);
map.set(true, ‘number’);
//Получение значений
console.log(map.get(‘1’)) //first value number;
console.log(map.get(true)) //number;
//Очистить коллекцию
map.clear();
console.log(map) //Map(0) {}
//Если хотим удалить один из элементов, то выбираем по ключу
let map = new Map()
map.set(‘1’, ‘one’);
map.set(‘2’, ‘two’)
map.delete(‘2’);
console.log(map) // Map(1){‘1’ => ‘one’}
//Можем посмотреть размер нашей коллекции
let map = new Map()
map.set(‘1’, ‘one’);
console.log(map.size) //1 - сколько элементов содержится внутри нашей коллекции.
Для интервью и пригодится в работе:
На выходе получить массив совпадений -> все совпадения запушить в массив -> сделать массив с уникальными значениями.
new Set() - особый вид коллекции (нет ключей), все значения уникальные.
let set = new Set() или let set = new Set([‘value1’, ‘value2’, 3, 4])
console.log(set); //Set(0) {} или
console.log(set) // Set(4) {‘value1’, ‘value2’, 3, 4}
Set – это особый вид коллекции: «множество» значений (без ключей), где каждое значение может появляться только один раз.
Его основные методы это:
new Set(iterable) – создаёт Set, и если в качестве аргумента был предоставлен итерируемый объект (обычно это массив), то копирует его значения в новый Set.
set.add(value) – добавляет значение (если оно уже есть, то ничего не делает), возвращает тот же объект set.
set.delete(value) – удаляет значение, возвращает true, если value было в множестве на момент вызова, иначе false.
set.has(value) – возвращает true, если значение присутствует в множестве, иначе false.
set.clear() – удаляет все имеющиеся значения.
set.size – возвращает количество элементов в множестве.
//Добавление значений
проверим, что они уникальные:
set.add(‘value1’);
set.add(‘value2’);
set.add(‘value1’);
console.log(‘set: ‘, set) //set: Set(2) {‘value1’, ‘value2’}
//Удалить значение
set.delete(‘value1’);
console.log(‘set after deleting: ‘, set) //set after deleting: Set(1) {‘value2’}
//Проверить содержится ли какое-то значение и передаем значение
console.log(‘is it here?’, set.has(‘value1’)) //false
console.log(‘is it here?’, set.has(‘value2’)) //true
//Очистить коллекцию:
set.clear()
console.log(set); //Set(0){}
!!!Практика:
let numbers = [1, 1, 1, 3, 4, 5, 6, 76, 7, 8, 9, 0, 6]
let uniqueNumbers = new Set(numbers);
//console.log(uniqueNumbers); //Set(10) {1,2,3,4,5,6,76,7,8,9,0}
Создали объект с уникальными значениями
let newArr = […uniqueNumbers];
console.log(newArr);
//[1,3,4,5,6,76,7,8,9,0]
Создали массив
или короткая запись
let result = […new Set(numbers)];
console.log(result); //[1,3,4,5,6,76,7,8,9,0]
Map: Используется, когда нужно хранить данные в виде ключ-значение, и ключи могут быть любого типа. Set: Используется, когда нужно хранить уникальные значения.
Map: Часто используется для хранения словарей, когда для каждого слова есть соответствующее значение.
Set: Полезен, например, при фильтрации уникальных значений из массива или для отслеживания уникальных идентификаторов.
