You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/04-object-basics/06-constructor-new/article.md
+20-20Lines changed: 20 additions & 20 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@
9
9
Функции-конструкторы технически являются обычными функциями. Но есть два соглашения:
10
10
11
11
1. Имя функции-конструктора должно начинаться с большой буквы.
12
-
2.Они должны выполняться только с помощью оператора `"new"`.
12
+
2.Функция-конструктор должна выполняться только с помощью оператора `"new"`.
13
13
14
14
Например:
15
15
@@ -27,10 +27,10 @@ alert(user.name); // Jack
27
27
alert(user.isAdmin); // false
28
28
```
29
29
30
-
Когда функция выполняется с помощью `new`, она выполняет следующие действия:
30
+
Когда функция вызывается как `new User(...)`, происходит следующее:
31
31
32
-
1. Создаётся новый пустой объект, которому присваивается значение`this`.
33
-
2. Выполняется тело функции. Обычно он модифицирует `this`, добавляя туда новые свойства.
32
+
1. Создаётся новый пустой объект, и он присваивается`this`.
33
+
2. Выполняется тело функции. Обычно оно модифицирует `this`, добавляя туда новые свойства.
34
34
3. Возвращается значение `this`.
35
35
36
36
Другими словами, `new User(...)` делает что-то вроде:
@@ -51,7 +51,7 @@ function User(name) {
51
51
}
52
52
```
53
53
54
-
Таким образом, `let user = new User("Jack")`даёт тот же результат, что и:
54
+
Таким образом, `let user = new User("Jack")`возвращает тот же результат, что и:
55
55
56
56
```js
57
57
let user = {
@@ -60,14 +60,14 @@ let user = {
60
60
};
61
61
```
62
62
63
-
Теперь, если нам будет необходимо создать других пользователей, мы можем просто вызвать `new User("Ann")`, `new User("Alice")` и так далее. Данная конструкция гораздо удобнее и читабельнее, чем каждый раз создавать литерал объекта.
63
+
Теперь, если нам будет необходимо создать других пользователей, мы можем просто вызвать `new User("Ann")`, `new User("Alice")` и так далее. Данная конструкция гораздо удобнее и читабельнее, чем многократное создание литерала объекта.
64
64
65
65
Это и является основной целью конструкторов - реализовать код для многократного создания однотипных объектов.
66
66
67
-
Давайте ещё раз отметим - технически любая функция (кроме функций со стрелками, поскольку у них нет `this`) может использоваться в качестве конструктора. Его можно запустить с помощью `new`, и он выполнит выше указанный алгоритм. Должна начинаться с "заглавной буквы" - это общее соглашение, чтобы было ясно, что функция должна вызываться с помощью "new".
67
+
Давайте ещё раз отметим - технически любая функция (кроме стрелочных функций, поскольку у них нет `this`) может использоваться в качестве конструктора. Его можно запустить с помощью `new`, и он выполнит выше указанный алгоритм. Подобные функции должны начинаться с заглавной буквы - это общепринятое соглашение, чтобы было ясно, что функция должна вызываться с помощью "new".
68
68
69
69
````smart header="new function() { ... }"
70
-
Если у нас есть много строк кода, посвящённых созданию одного сложного объекта, мы можем обернуть их в немедленно вызываемую функцию-конструктор, вот так:
70
+
Если в нашем коде присутствует большое количество строк, создающих один сложный объект, то мы можем обернуть их в функцию-конструктор, которая будет немедленно вызвана, вот так:
71
71
72
72
```js
73
73
// создаём функцию и сразу же вызываем её с помощью new
@@ -76,7 +76,7 @@ let user = new function() {
76
76
this.isAdmin = false;
77
77
78
78
// ...другой код для создания пользователя
79
-
// может быть, сложная логика и инструкции
79
+
// возможна любая сложная логика и инструкции
80
80
// локальные переменные и так далее
81
81
};
82
82
```
@@ -87,12 +87,12 @@ let user = new function() {
87
87
## Проверка на вызов в режиме конструктора: new.target
88
88
89
89
```smart header="Продвинутая возможность"
90
-
Синтаксис из этого раздела используется крайне редко, пропустите его, если не хотите углубляться вo все детали языка.
90
+
Синтаксис из этого раздела используется крайне редко. Вы можете пропустите его, если не хотите углубляться в детали языка.
91
91
```
92
92
93
93
Используя специальное свойство `new.target` внутри функции, мы можем проверить, вызвана ли функция при помощи оператора `new` или без него.
94
94
95
-
Он будет `undefined` для обычных вызовов и равен функции, если вызывается с помощью `new`:
95
+
В случае обычного вызова функции `new.target`будет `undefined`. Если же она была вызвана при помощи `new`, `new.target` будет равен самой функции.
96
96
97
97
```js run
98
98
functionUser() {
@@ -112,7 +112,7 @@ new User(); // function User { ... }
112
112
113
113
Это можно использовать внутри функции, чтобы узнать, была ли она вызвана при помощи `new`, "в режиме конструктора", или без него, "в обычном режиме".
114
114
115
-
Мы также можем сделать чтобы `new` и обычные вызовы делали одно и тоже, как-то так:
115
+
Также мы можем сделать, чтобы вызовы с `new` и без него делали одно и то же:
116
116
117
117
```js run
118
118
functionUser(name) {
@@ -127,13 +127,13 @@ let john = User("John"); // переадресовывает вызов на new
127
127
alert(john.name); // John
128
128
```
129
129
130
-
Такой подход иногда используется в библиотеках, чтобы сделать синтаксис более гибким. Так чтобы люди могли вызывать функцию с `new`или без него, и она все ещё могла работать.
130
+
Такой подход иногда используется в библиотеках, чтобы сделать синтаксис более гибким. Чтобы люди могли вызывать функцию с `new`и без него, и она все ещё могла работать.
131
131
132
-
Впрочем, вероятно, это не очень хорошая практика использовать этот трюк везде, так как опуск`new`делает немного менее очевидным то, что происходит. С `new` мы все точно знаем, что создаётся новый объект.
132
+
Впрочем, вероятно, это не очень хорошая практика использовать этот трюк везде, так как отсутствие`new`может ввести разработчика в заблуждение. С `new` мы точно знаем, что создаётся новый объект.
133
133
134
134
## Возврат значения из конструктора, return
135
135
136
-
Обычно конструкторы не имеют `return`. Их задача - записать все необходимое в `this`, и это автоматически становится результатом.
136
+
Обычно конструкторы не имеют оператора `return`. Их задача - записать все необходимое в `this`, и это автоматически становится результатом.
137
137
138
138
Но если `return` всё же есть, то применяется простое правило:
139
139
@@ -170,8 +170,8 @@ alert( new SmallUser().name ); // John
170
170
171
171
Обычно у конструкторов отсутствует `return`. Здесь мы упомянули особое поведение с возвращаемыми объектами в основном для полноты картины.
172
172
173
-
````smart header="Опуск скобок"
174
-
Кстати, мы можем не ставить круглые скобки после `new`, если у него нет аргументов:
173
+
````smart header="Пропуск скобок"
174
+
Кстати, мы можем не ставить круглые скобки после `new`, если вызов конструктора идёт без аргументов:
175
175
176
176
```js
177
177
let user = new User; // <-- без скобок
@@ -217,14 +217,14 @@ john = {
217
217
218
218
## Итого
219
219
220
-
- Функции-конструкторы или просто конструкторы, являются обычными функциями, но существует общее соглашение именовать их с заглавной буквы.
220
+
- Функции-конструкторы или просто конструкторы, являются обычными функциями, но существует общепринятое соглашение именовать их с заглавной буквы.
221
221
- Функции-конструкторы следует вызывать только с помощью `new`. Такой вызов подразумевает создание пустого `this` в начале и возврат заполненного в конце.
222
222
223
223
Мы можем использовать конструкторы для создания множества похожих объектов.
224
224
225
-
JavaScript предоставляет функции-конструкторы для множества встроенных объектов языка: таких как `Date` для дат, `Set` для наборов и других, которые нам ещё предстоит изучить.
225
+
JavaScript предоставляет функции-конструкторы для множества встроенных объектов языка: таких как `Date`, `Set`, и других, которые нам ещё предстоит изучить.
226
226
227
-
```smart header="Объекты, we'll be back! (мы ещё вернёмся!)"
227
+
```smart header="Мы ещё вернёмся к объектам!"
228
228
В этой главе мы рассмотрели только основы объектов и конструкторов. Данная информация необходима нам для дальнейшего изучения типов данных и функций в последующих главах.
229
229
230
230
Как только мы с ними разберёмся, мы вернёмся к объектам для более детального изучения в главах <info:prototypes> и <info:classes>.
0 commit comments