Слайд 2
![Сборка мусора (garbage collection) Одна из форм автоматического управления памятью.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-1.jpg)
Сборка мусора (garbage collection)
Одна из форм автоматического управления памятью. Специальный процесс,
называемый сборщиком мусора ( garbage collector), периодически освобождает память, удаляя объекты, которые уже не будут востребованы
В JavaScript сборка мусора выполняется автоматически. Мы не можем ускорить или предотвратить её.
Слайд 3
![Достижимость Основной концепцией управления памятью в JavaScript является принцип достижимости.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-2.jpg)
Достижимость
Основной концепцией управления памятью в JavaScript является принцип достижимости.
Достижимые значения –
это те, которые доступны или используются. Они гарантированно находятся в памяти.
Слайд 4
![Существует базовое множество достижимых значений, которые не могут быть удалены](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-3.jpg)
Существует базовое множество достижимых значений, которые не могут быть удалены (далее
Корни):
Локальные переменные и параметры текущей функции.
Переменные и параметры других функций в текущей цепочке вложенных вызовов.
Глобальные переменные.
Слайд 5
![Любое другое значение считается достижимым, если оно доступно из корня](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-4.jpg)
Любое другое значение считается достижимым, если оно доступно из корня по
ссылке или по цепочке ссылок.
Если в локальной переменной есть объект, и он имеет свойство, в котором хранится ссылка на другой объект, то этот объект считается достижимым. И те, на которые он ссылается, тоже достижимы.
Слайд 6
![Простой пример let user = { name: "John" };](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-5.jpg)
Простой пример
let user = {
name: "John"
};
Слайд 7
![Удаляем ссылку на объект user = null;](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-6.jpg)
Удаляем ссылку на объект
user = null;
Слайд 8
![Две ссылки // в user находится ссылка на объект let](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-7.jpg)
Две ссылки
// в user находится ссылка на объект
let user = {
name: "John"
};
let admin = user;
Слайд 9
![Удаляем ссылку на объект user = null;](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-8.jpg)
Удаляем ссылку на объект
user = null;
Слайд 10
![Взаимосвязанные объекты function marry(man, woman) { woman.husband = man; man.wife](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-9.jpg)
Взаимосвязанные объекты
function marry(man, woman) {
woman.husband = man;
man.wife = woman;
return {
father: man,
mother: woman
}
}
let family = marry({
name: "John"
}, {
name: "Ann"
});
Слайд 11
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-10.jpg)
Слайд 12
![delete family.father; delete family.mother.husband;](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-11.jpg)
delete family.father;
delete family.mother.husband;
Слайд 13
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-12.jpg)
Слайд 14
![После сборки мусора](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-13.jpg)
Слайд 15
![Недостаточно удалить только одну из этих ссылок, потому что все](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-14.jpg)
Недостаточно удалить только одну из этих ссылок, потому что все объекты
останутся достижимыми.
Исходящие ссылки не имеют значения. Только входящие ссылки могут сделать объект достижимым.
Слайд 16
![Недостижимый «остров» Вполне возможна ситуация, при которой целый «остров» связанных](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-15.jpg)
Недостижимый «остров»
Вполне возможна ситуация, при которой целый «остров» связанных объектов может
стать недостижимым и удалится из памяти.
family = null;
Слайд 17
![](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-16.jpg)
Слайд 18
![Алгоритм сборщика мусора Сборщик мусора «помечает» (запоминает) все корневые объекты.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-17.jpg)
Алгоритм сборщика мусора
Сборщик мусора «помечает» (запоминает) все корневые объекты.
Затем он идёт
по их ссылкам и помечает все найденные объекты.
Затем он идёт по ссылкам помеченных объектов и помечает объекты, на которые есть ссылка от них. Все объекты запоминаются, чтобы в будущем не посещать один и тот же объект дважды.
…И так далее, пока не будут посещены все ссылки (достижимые от корней).
Все непомеченные объекты удаляются.
Слайд 19
![Методы объекта Функциональное выражение: let user = { name: "Джон",](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-18.jpg)
Методы объекта
Функциональное выражение:
let user = {
name: "Джон",
age: 30
};
user.sayHi = function() {
alert("Привет!");
};
user.sayHi(); // Привет!
Слайд 20
![Создали объект Объявили функцию Присвоили функцию объекту Можем вызывать функцию](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-19.jpg)
Создали объект
Объявили функцию
Присвоили функцию объекту
Можем вызывать функцию
Слайд 21
![Сокращённая запись метода // эти объекты делают одно и то](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-20.jpg)
Сокращённая запись метода
// эти объекты делают одно и то же (одинаковые методы)
user = {
sayHi: function() {
alert("Привет");
}
};
user = {
sayHi() { // то же самое, что и "sayHi: function()"
alert("Привет");
}
};
Слайд 22
![Ключевое слово «this» в методах Для доступа к информации внутри](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-21.jpg)
Ключевое слово «this» в методах
Для доступа к информации внутри объекта метод
может использовать ключевое слово this.
Значение this – это объект «перед точкой», который использовался для вызова метода.
Слайд 23
![let user = { name: "Джон", age: 30, sayHi() {](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-22.jpg)
let user = {
name: "Джон",
age: 30,
sayHi() {
// this - это "текущий объект"
alert(this.name);
}
};
user.sayHi();
Джон
Слайд 24
![let user = { name: "Джон", age: 30, sayHi() {](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-23.jpg)
let user = {
name: "Джон",
age: 30,
sayHi() {
alert( user.name );
}
};
let admin = user;
user = null;
admin.sayHi();
Ошибка! user не ссылается на объект!
Слайд 25
![«this» не является фиксированным В JavaScript ключевое слово «this» ведёт](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-24.jpg)
«this» не является фиксированным
В JavaScript ключевое слово «this» ведёт себя иначе,
чем в большинстве других языков программирования. Оно может использоваться в любой функции.
function sayHi() {
alert( this.name );
}
Слайд 26
![«this» не является фиксированным Значение this вычисляется во время выполнения кода и зависит от контекста.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-25.jpg)
«this» не является фиксированным
Значение this вычисляется во время выполнения кода и
зависит от контекста.
Слайд 27
![let user = { name: "Джон" }; let admin =](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-26.jpg)
let user = { name: "Джон" };
let admin = { name: "Админ" };
function sayHi() {
alert( this.name );
}
user.f = sayHi;
admin.f = sayHi;
user.f(); // Джон (this == user)
admin.f(); // Админ (this == admin)
admin['f'](); // Админ
Слайд 28
![Последствия свободного this Вы, скорее всего, привыкли к идее "фиксированного](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-27.jpg)
Последствия свободного this
Вы, скорее всего, привыкли к идее "фиксированного this" –
когда методы, определённые внутри объекта, всегда сохраняют в качестве значения this ссылку на свой объект (в котором был определён метод).
В JavaScript this является «свободным», его значение вычисляется в момент вызова метода и не зависит от того, где этот метод был объявлен, а зависит от того, какой объект вызывает метод (какой объект стоит «перед точкой»).
Слайд 29
![Некоторые хитрые способы вызова метода приводят к потере значения this](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-28.jpg)
Некоторые хитрые способы вызова метода приводят к потере значения this
let user = {
name: "Джон",
hi() { alert(this.name); },
bye() { alert("Пока"); }
};
user.hi();
(user.name == "Джон" ? user.hi : user.bye)();
Джон
Ошибка!
Слайд 30
![let user = { name: "Джон", hi() { alert(this.name); }](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-29.jpg)
let user = {
name: "Джон",
hi() { alert(this.name); }
}
let hi = user.hi;
hi();
Ошибка!
Слайд 31
![У стрелочных функций нет «this» let user = { firstName:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-30.jpg)
У стрелочных функций нет «this»
let user = {
firstName: "Илья",
sayHi() {
let arrow = () => alert(this.firstName);
arrow();
}
};
user.sayHi();
Илья
Слайд 32
![Функция-конструктор Функции-конструкторы являются обычными функциями. Но есть два соглашения: Имя](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-31.jpg)
Функция-конструктор
Функции-конструкторы являются обычными функциями. Но есть два соглашения:
Имя функции-конструктора должно начинаться
с большой буквы.
Функция-конструктор должна вызываться при помощи оператора "new".
Слайд 33
![function User(name) { this.name = name; this.isAdmin = false; }](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-32.jpg)
function User(name) {
this.name = name;
this.isAdmin = false;
}
let user = new User("Вася");
alert(user.name);
alert(user.isAdmin);
Вася
false
Слайд 34
![Создаётся новый пустой объект, и он присваивается this. Выполняется код](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-33.jpg)
Создаётся новый пустой объект, и он присваивается this.
Выполняется код функции. Обычно
он модифицирует this, добавляет туда новые свойства.
Возвращается значение this.
Слайд 35
![function User(name) { // this = {}; (неявно) // добавляет](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-34.jpg)
function User(name) {
// this = {}; (неявно)
// добавляет свойства к this
this.name = name;
this.isAdmin = false;
// return this; (неявно)
}
Слайд 36
![Возврат значения из конструктора return Обычно конструкторы ничего не возвращают](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-35.jpg)
Возврат значения из конструктора return
Обычно конструкторы ничего не возвращают явно. Их
задача – записать все необходимое в this, который в итоге станет результатом.
Но если return всё же есть, то применяется простое правило:
При вызове return с объектом, будет возвращён объект, а не this.
При вызове return с примитивным значением, примитивное значение будет отброшено.
Другими словами, return с объектом возвращает объект, в любом другом случае конструктор вернёт this.
Слайд 37
![function BigUser() { this.name = "Вася"; return { name: "Godzilla"](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-36.jpg)
function BigUser() {
this.name = "Вася";
return { name: "Godzilla" };
// возвращает этот объект
}
alert( new BigUser().name );
// Godzilla, получили этот объект
Слайд 38
![function SmallUser() { this.name = "Вася"; return; // } alert( new SmallUser().name ); // Вася](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-37.jpg)
function SmallUser() {
this.name = "Вася";
return; // <-- возвращает this
}
alert( new SmallUser().name ); // Вася
Слайд 39
![Создание методов в конструкторе Использование конструкторов для создания объектов даёт](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-38.jpg)
Создание методов в конструкторе
Использование конструкторов для создания объектов даёт большую гибкость.
Можно передавать конструктору параметры, определяющие, как создавать объект, и что в него записывать.
В this мы можем добавлять не только свойства, но и методы.
Например new User(name) создаёт объект с данным именем name и методом sayHi:
Слайд 40
![function User(name) { this.name = name; this.sayHi = function() {](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-39.jpg)
function User(name) {
this.name = name;
this.sayHi = function() {
alert( "Меня зовут: " + this.name );
};
}
let vasya = new User("Вася");
vasya.sayHi();
Меня зовут: Вася
Слайд 41
![Замыкание Это функция, которая запоминает свои внешние переменные и может](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-40.jpg)
Замыкание
Это функция, которая запоминает свои внешние переменные и может получить к
ним доступ. В некоторых языках это невозможно, или функция должна быть написана специальным образом, чтобы получилось замыкание. Но в JavaScript, все функции изначально являются замыканиями
Слайд 42
![Вложенные функции Функция называется «вложенной», когда она создаётся внутри другой](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-41.jpg)
Вложенные функции
Функция называется «вложенной», когда она создаётся внутри другой функции.
function sayHiBye(firstName, lastName) {
function getFullName() {
return firstName + " " + lastName;
}
alert( "Hello, " + getFullName() );
alert( "Bye, " + getFullName() );
}
Слайд 43
![Вложенные функции Вложенная функция может быть возвращена: либо в качестве](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-42.jpg)
Вложенные функции
Вложенная функция может быть возвращена: либо в качестве свойства нового
объекта (если внешняя функция создаёт объект с методами), либо сама по себе. И затем может быть использована в любом месте. Не важно где, она всё так же будет иметь доступ к тем же внешним переменным.
Слайд 44
![// функция-конструктор возвращает новый объект function User(name) { // методом](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-43.jpg)
// функция-конструктор возвращает новый объект
function User(name) {
// методом объекта становится вложенная функция
this.sayHi = function() {
alert(name);
};
}
let user = new User("John");
user.sayHi();
// у кода метода "sayHi" есть доступ к внешней переменной "name"
Слайд 45
![function makeCounter() { let count = 0; return function() {](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-44.jpg)
function makeCounter() {
let count = 0;
return function() {
return count++;
// есть доступ к внешней переменной "count"
};
}
let counter = makeCounter();
alert( counter() );
alert( counter() );
alert( counter() );
0
1
2
Слайд 46
![Массивы Объекты позволяют хранить данные со строковыми ключами. Это замечательно.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-45.jpg)
Массивы
Объекты позволяют хранить данные со строковыми ключами. Это замечательно.
Но довольно часто
мы понимаем, что нам необходима упорядоченная коллекция данных, в которой присутствуют 1-й, 2-й, 3-й элементы и т.д. Например, она понадобится нам для хранения списка чего-либо: пользователей, товаров, элементов HTML и т.д.
Слайд 47
![Объявление let arr = []; let fruits = ["Яблоко", "Апельсин",](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-46.jpg)
Объявление
let arr = [];
let fruits = ["Яблоко", "Апельсин", "Слива"];
alert( fruits[0] ); // Яблоко
alert( fruits[1] ); // Апельсин
alert( fruits[2] ); // Слива
alert( fruits.length ); // 3
Слайд 48
![В массиве могут храниться элементы любого типа. // разные типы](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-47.jpg)
В массиве могут храниться элементы любого типа.
// разные типы значений
let arr = [ 'Яблоко', { name: 'Джон' },
true, function() { alert('привет'); } ];
// получить элемент с индексом 1 (объект) и
// затем показать его свойство
alert( arr[1].name ); // Джон
// получить элемент с индексом 3 (функция) и выполнить её
arr[3](); // привет
Слайд 49
![Висячая запятая Список элементов массива, как и список свойств объекта,](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-48.jpg)
Висячая запятая
Список элементов массива, как и список свойств объекта, может оканчиваться
запятой:
let fruits = [
"Яблоко",
"Апельсин",
"Слива",
];
Слайд 50
![Методы pop/push, shift/unshift Очередь – один из самых распространённых вариантов](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-49.jpg)
Методы pop/push, shift/unshift
Очередь – один из самых распространённых вариантов применения массива.
В области компьютерных наук так называется упорядоченная коллекция элементов, поддерживающая два вида операций:
push добавляет элемент в конец.
shift удаляет элемент в начале, сдвигая очередь, так что второй элемент становится первым.
Слайд 51
![Массивы поддерживают обе операции. На практике необходимость в этом возникает](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-50.jpg)
Массивы поддерживают обе операции.
На практике необходимость в этом возникает очень часто.
Например, очередь сообщений, которые надо показать на экране.
Слайд 52
![Существует и другой вариант применения для массивов – структура данных,](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-51.jpg)
Существует и другой вариант применения для массивов – структура данных, называемая
стек.
Она поддерживает два вида операций:
push добавляет элемент в конец.
pop удаляет последний элемент.
Слайд 53
![Массивы в JavaScript могут работать и как очередь, и как](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-52.jpg)
Массивы в JavaScript могут работать и как очередь, и как стек.
Можно добавлять/удалять элементы как в начало, так и в конец массива.
Слайд 54
![pop Удаляет последний элемент из массива и возвращает его: let](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-53.jpg)
pop
Удаляет последний элемент из массива и возвращает его:
let fruits = ["Яблоко", "Апельсин", "Груша"];
alert( fruits.pop() );
// удаляем "Груша" и выводим его
alert( fruits ); // Яблоко, Апельсин
Слайд 55
![push Добавляет элемент в конец массива let fruits = ["Яблоко",](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-54.jpg)
push
Добавляет элемент в конец массива
let fruits = ["Яблоко", "Апельсин"];
fruits.push("Груша");
alert( fruits ); // Яблоко, Апельсин, Груша
Слайд 56
![shift Удаляет из массива первый элемент и возвращает его: let](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-55.jpg)
shift
Удаляет из массива первый элемент и возвращает его:
let fruits = ["Яблоко", "Апельсин", "Груша"];
alert( fruits.shift() );
// удаляет Яблоко и выводим его
alert( fruits ); // Апельсин, Груша
Слайд 57
![unshift Добавляет элемент в начало массива: let fruits = ["Апельсин",](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-56.jpg)
unshift
Добавляет элемент в начало массива:
let fruits = ["Апельсин", "Груша"];
fruits.unshift('Яблоко');
alert( fruits ); // Яблоко, Апельсин, Груша
Слайд 58
![Методы push и unshift могут добавлять сразу несколько элементов: let](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-57.jpg)
Методы push и unshift могут добавлять сразу несколько элементов:
let fruits = ["Яблоко"];
fruits.push("Апельсин", "Груша");
fruits.unshift("Ананас", "Лимон");
// ["Ананас", "Лимон", "Яблоко", "Апельсин", "Груша"]
alert( fruits );
Слайд 59
![Эффективность Методы push/pop выполняются быстро, а методы shift/unshift – медленно.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-58.jpg)
Эффективность
Методы push/pop выполняются быстро, а методы shift/unshift – медленно.
Слайд 60
![Перебор элементов Одним из самых старых способов перебора элементов массива](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-59.jpg)
Перебор элементов
Одним из самых старых способов перебора элементов массива является цикл
for по цифровым индексам:
let arr = ["Яблоко", "Апельсин", "Груша"];
for (let i = 0; i < arr.length; i++) {
alert( arr[i] );
}
Слайд 61
![Другой вариант цикла, for..of: let fruits = ["Яблоко", "Апельсин", "Слива"];](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-60.jpg)
Другой вариант цикла, for..of:
let fruits = ["Яблоко", "Апельсин", "Слива"];
// проходит по значениям
for (let fruit of fruits) {
alert( fruit );
}
Слайд 62
![Технически, так как массив является объектом, можно использовать и вариант](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-61.jpg)
Технически, так как массив является объектом, можно использовать и вариант for..in
let arr = ["Яблоко", "Апельсин", "Груша"];
for (let key in arr) {
alert( arr[key] ); // Яблоко, Апельсин, Груша
}
Слайд 63
![Цикл for..in выполняет перебор всех свойств объекта, а не только](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-62.jpg)
Цикл for..in выполняет перебор всех свойств объекта, а не только цифровых.
В
браузере и других программных средах также существуют так называемые «псевдомассивы» – объекты, которые выглядят, как массив. То есть, у них есть свойство length и индексы, но они также могут иметь дополнительные нечисловые свойства и методы, которые нам обычно не нужны. Тем не менее, цикл for..in выведет и их. Поэтому, если нам приходится иметь дело с объектами, похожими на массив, такие «лишние» свойства могут стать проблемой.
Слайд 64
![Цикл for..in оптимизирован под произвольные объекты, не массивы, и поэтому](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-63.jpg)
Цикл for..in оптимизирован под произвольные объекты, не массивы, и поэтому в
10-100 раз медленнее. Увеличение скорости выполнения может иметь значение только при возникновении узких мест. Но мы всё же должны представлять разницу.
В общем, не следует использовать цикл for..in для массивов.
Слайд 65
![Дата и время Встречайте новый встроенный объект: Date. Он содержит](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-64.jpg)
Дата и время
Встречайте новый встроенный объект: Date. Он содержит дату и
время, а также предоставляет методы управления ими.
Например, его можно использовать для хранения времени создания/изменения, для измерения времени или просто для вывода текущей даты.
Слайд 66
![Создание Для создания нового объекта Date нужно вызвать конструктор new](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-65.jpg)
Создание
Для создания нового объекта Date нужно вызвать конструктор new Date() с
одним из следующих аргументов:
new Date()
Без аргументов – создать объект Date с текущими датой и временем:
let now = new Date();
alert( now ); // показывает текущие дату и время
Слайд 67
![new Date(milliseconds) Создать объект Date с временем, равным количеству миллисекунд](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-66.jpg)
new Date(milliseconds)
Создать объект Date с временем, равным количеству миллисекунд (тысячная доля секунды),
прошедших с 1 января 1970 года UTC+0.
// 0 соответствует 01.01.1970 UTC+0
let Jan01_1970 = new Date(0);
alert( Jan01_1970 );
// теперь добавим 24 часа и получим 02.01.1970 UTC+0
let Jan02_1970 = new Date(24 * 3600 * 1000);
alert( Jan02_1970 );
Слайд 68
![Датам до 1 января 1970 будут соответствовать отрицательные таймстампы, например:](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-67.jpg)
Датам до 1 января 1970 будут соответствовать отрицательные таймстампы, например:
// 31 декабря 1969 года
let Dec31_1969 = new Date(-24 * 3600 * 1000);
alert( Dec31_1969 );
Слайд 69
![Получение компонентов даты Существуют методы получения года, месяца и т.д.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-68.jpg)
Получение компонентов даты
Существуют методы получения года, месяца и т.д. из объекта
Date:
getFullYear()
Получить год (4 цифры)
getMonth()
Получить месяц, от 0 до 11.
getDate()
Получить день месяца, от 1 до 31, что несколько противоречит названию метода.
getHours(), getMinutes(), getSeconds(), getMilliseconds()
Получить, соответственно, часы, минуты, секунды или миллисекунды.
Слайд 70
![JSON JSON (англ. JavaScript Object Notation) — текстовый формат обмена](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-69.jpg)
JSON
JSON (англ. JavaScript Object Notation) — текстовый формат обмена данными, основанный
на JavaScript. Как и многие другие текстовые форматы, JSON легко читается людьми. Формат JSON был разработан Дугласом Крокфордом.
Слайд 71
![JSON.stringify для преобразования объектов в JSON. JSON.parse для преобразования JSON обратно в объект.](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-70.jpg)
JSON.stringify для преобразования объектов в JSON.
JSON.parse для преобразования JSON обратно
в объект.
Слайд 72
![let student = { name: 'John', age: 30, isAdmin: false,](/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/238202/slide-71.jpg)
let student = {
name: 'John',
age: 30,
isAdmin: false,
courses: ['html', 'css', 'js’]
};
let json = JSON.stringify(student);
alert(typeof json); // мы получили строку!
alert(json);
/* выведет объект в формате JSON:
{
"name": "John",
"age": 30,
"isAdmin": false,
"courses": ["html", "css", "js"],
}*/