code_notes
71 subscribers
136 photos
1 video
134 links
учусь делать веб

обратная связь: t.me/dmorenogogoleva
Download Telegram
let codes = {
"49": "Германия",
"41": "Швейцария",
"44": "Великобритания",
// ..,
"1": "США"
};

for (let code in codes) {
alert(code); // 1, 41, 44, 49
}
1. при копировании переменной, указывающей на объект, копируется ссылка на объект
let user = { name: "John" };
let admin = user; // копируется ссылка

2. объекты равны только если это один и тот же объект
user === admin // true

let a = {};
let b = {}; // два независимых объекта

alert( a == b ); // false

3. способы нормально скопировать объект
let user = {
name: "John",
age: 30
};

- let clone = Object.assign({}, user);

- let clone2 = { ...user }

- let clone3 = JSON.parse(JSON.stringify(user))

!глубокое клонирование!
- let clone4 = _.cloneDeep(user);
https://lodash.com/docs/4.17.15#cloneDeep

4. проверить объект на пустоту
Object.keys(user).length == 0
убрать повторяющиеся элементы массива

1. arr.filter((el, index) => arr.indexOf(el) >= index)

2. Array.from(new Set(arr))
Symbol

примитивный тип данных
все символы уникальны
let id1 = Symbol("id");
let id2 = Symbol("id");

alert(id1 == id2); // false

Symbol можно использовать как ключ в объекте:
let id = Symbol("id");

let user = {
name: "Егор",
[id]: 123
};

прочитать все символы объекта:
Object.getOwnPropertySymbols(obj)
Global symbol registry

чтобы символы с одинаковыми именами были одной сущностью нужно использовать глобальный реестр символов

запись:
const id = Symbol.for("id")

чтение:
const first = Symbol.keyFor(id)
const second = Symbol.keyFor(id)

first === second // true


the symbol registry is mostly built by JavaScript's compiler infrastructure, and the symbol registry's content is not available to JavaScript's run-time infrastructure
отменить коммит, сохранить изменения

git reset --soft HEAD^
если нам требуется создать много однотипных объектов, мы должны использовать функцию-конструктор и оператор new

const User = function(name) {
this.name = name;
this.isAdmin = false;
}

const masha = new User("Masha");

// { name: "Masha", isAdmin: false }
Свойство length автоматически обновляется при изменении массива. Если быть точными, это не количество элементов массива, а наибольший цифровой индекс плюс один.

let fruits = [];
fruits[123] = "Яблоко";

alert( fruits.length ); // 124
Map – это коллекция ключ/значение, как и Object. Но основное отличие в том, что Map позволяет использовать ключи любого типа.
вот так можно создать Map из object


let obj = {
name: "John",
age: 30
};

let map = new Map(Object.entries(obj));
вот так можно создать object из Map:

let map = new Map();
map.set('banana', 1);
map.set('orange', 2);
map.set('meat', 4);

let obj = Object.fromEntries(map);

// готово!
// obj = { banana: 1, orange: 2, meat: 4 }

alert(obj.orange); // 2
timestamp — целое число, представляющее собой количество миллисекунд, прошедших с начала 1970 года

const stamp = 999999999276;


из таймстампа можно легко получить дату:

new Date(stamp);
// Sun Sep 09 2001 05:46:39 GMT+0400 (Moscow Summer Time)


а из даты можно сделать таймстамп:

new Date().getTime()
// 1565845435771
рекурсия

функция, которая вызывает сама себя.
любую рекурсию можно представить в виде цикла.
код легче читать и поддерживать, но выполняется медленнее, чем цикл.

const pow = (x, n) => {
if (n === 1) return x

return x * pow (x - 1)
}

pow(2, 3) // 8
pow(2, 5) // 32
функция навсегда запоминает ссылку на лексическое окружение, где она была создана. И [[Environment]] – скрытое свойство функции, которое содержит эту ссылку

В программировании есть общий термин: «замыкание», – которое должен знать каждый разработчик.

Замыкание – это функция, которая запоминает свои внешние переменные и может получить к ним доступ. В некоторых языках это невозможно, или функция должна быть написана специальным образом, чтобы получилось замыкание. Но, как было описано выше, в JavaScript, все функции изначально являются замыканиями, кроме функций, объявленных через new Function().

(Функции, объявленные через new Function, имеют [[Environment]], ссылающийся на глобальное лексическое окружение, а не на родительское. Это позволяет избежать проблем при минификации.)

То есть, они автоматически запоминают, где были созданы, с помощью скрытого свойства [[Environment]] и все они могут получить доступ к внешним переменным.

Когда на собеседовании фронтенд-разработчик получает вопрос: «что такое замыкание?», – правильным ответом будет определение замыкания и объяснения того факта, что все функции в JavaScript являются замыканиями, и, может быть, несколько слов о технических деталях: свойстве [[Environment]] и о том, как работает лексическое окружение.
глобальный объект предоставляет переменные и функции, доступные в любом месте программы. По умолчанию это те, что встроены в язык или среду исполнения.

в браузере он называется window, в Node.js — global, в другой среде исполнения может называться иначе.

недавно globalThis был добавлен в язык как стандартизированное имя для глобального объекта, которое должно поддерживаться в любом окружении.
декоратор это специальная функция, которая принимает другую функцию и изменяет её поведение.
let user = {
firstName: "Маша",
sayHi() {
alert(`Привет, ${this.firstName}!`);
}
};

this передается в функцию только при следующей комбинации - obj.func(), причем должны быть одновременно все элемены в одном месте и в этом же порядке, т.е. объект перед точкой, после точки имя функции (метода) и после имени метода обязательно сразу же круглые скобки. Если хоть чего то нет - this не передается и теряется. Соответсвенно если user.sayHi (нет скобок) или просто sayHi() (нет объекта перед точкой) или например передали функцию как аргумент function (user.sayHi) {...... user.sayHi()}, а потом вызвали ее внутри функции (при передаче через аргумент this уже потерялся) - везде везде потяря this. Решают проблему явная передача/прикрепление this с помощью call/apply, bind
Стрелочные функции:

- Не имеют this.
- Не имеют arguments.
- Не могут быть вызваны с new.
Помимо значения value, свойства объекта имеют три специальных атрибута (так называемые «флаги»).

writable – если true, свойство можно изменить, иначе оно только для чтения.

enumerable – если true, свойство перечисляется в циклах, в противном случае циклы его игнорируют.

configurable – если true, свойство можно удалить, а эти атрибуты можно изменять, иначе этого делать нельзя.

Описание свойства называется дескриптор и позволяет получить полную информацию о свойстве

Дескриптор можно получить вот так:
const user = {
name: "Маша"
};

const descriptor = Object.getOwnPropertyDescriptor(user, 'name');

JSON.stringify(descriptor)

{
"value": "Маша",
"writable": true,
"enumerable": true,
"configurable": true
}



Вот так можно создать свойство, доступное только для чтения:
const user = {
name: "Маша"
};

Object.defineProperty(user, "name", {
writable: false
});

user.name = 'Саша'

user.name
//"Маша"
Геттеры и сеттеры

это свойства-аксессоры (accessor properties). По своей сути это функции, которые используются для присвоения и получения значения, но во внешнем коде они выглядят как обычные свойства объекта

как они используются в реальной жизни:
1. создаем объект с геттерами и сеттерами
const user = {
_name: 'Марина',
_surname: 'Цветаева',
get fullName() {
return `${this._name} ${this._surname}`
},
set poem(value) {
if (value.length < 4) {
throw Error('слишком короткое значение')
}
this._poem = value
},
get curPoem() {
return this._poem
}
}

2. получаем значение из геттера
user.fullName
// "Марина Цветаева"

можно даже так:
const { fullName } = user
// fullName "Марина Цветаева"

3. устанавливаем значение в сеттер
user.poem = 'Го'
Uncaught Error: слишком короткое значение

user.poem = 'Гора горевала что только грустью'

4. получаем значение, которое только что установили
user.curPoem
//"Гора горевала что только грустью"

очень удобно:
1. все вычисления в одном месте, не будет разных значений fullName в разных местах приложения
2. внутренние свойства через нижеее подчёркивание(_) обретают истинный смысл — у них не будет случайных или неправильных значений
3. простой синтаксис
прототипное наследование

- объекты наследуются от других объектов
- каждый объект имеет прототип
- он записан в специальное скрытое свойство [[Prototype]]
- задать прототип можно через __proto__
- __proto__ это не [[Prototype]]. Это геттер/сеттер для него.

const animal = {
say: 'woff'
}

const dog = {
__proto__: animal
}

const cat = {
say: 'meow',
__proto__: animal
}

dog.say
// "woff"

cat.say
// "meow"

суть прототипного наследования в том, что если мы вызываем метод, которого нет в объекте, то он ищется по цепочке прототипов, пока не найдётся

наш самый верхний объект animal наследуется от Object.prototype, что добавляет всем нашим объектам методы типа toString() и hasOwnProperty()

Object.prototype в свою очередь наследуется от null (втф)