1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
|
---
title: Поднятие
slug: Glossary/Hoisting
translation_of: Glossary/Hoisting
original_slug: Словарь/Поднятие
---
<p>Поднятие (hoisting) — термин, который вы <em>не</em> встретите в документации JavaScript. Поднятие задумывалось как общий способ мышления о том, как контекст исполнения (в частности, фазы создания и исполнения) работает в JavaScript. Однако, hoisting может привести и к недоразумениям. Например, hoisting учит, что объявление переменной или функции физически перемещается в начало вашего кода, хотя в действительности этого не происходит. На самом же деле, объявления переменных и функций попадают в память в процессе фазы компиляции, но остаются в коде на том месте, где вы их объявили.</p>
<h2 id="Узнаем_больше">Узнаем больше</h2>
<h3 id="Пример">Пример:</h3>
<p>Одним из преимуществ помещения в память объявлений функций до выполнения кода то, что можно использовать функцию до ее объявления. Например:</p>
<pre class="brush: js">function catName(name) {
console.log("Мою кошку зовут " + name);
}
catName("Тигр");
/*
Результатом будет вывод строки: "Мою кошку зовут Тигр"
*/
</pre>
<p>Предыдущий пример демонстрирует ожидаемый рабочий код. Теперь давайте посмотрим, что происходит, когда мы вызываем функцию в коде до ее объявления:</p>
<pre class="brush: js">catName("Раиса");
function catName(name) {
console.log("Мою кошку зовут " + name);
}
/*
Результатом будет вывод строки: "Мою кошку зовут Раиса"
*/
</pre>
<p>Даже если мы вызываем функцию до ее объявления, код работает. Это происходит благодаря тому, как работает контекст выполнения в JavaScript.</p>
<p> </p>
<p><code>Hoisting</code> хорошо работает и с другими типами данных и переменными. Переменные могут быть инициализированы и использованы до их объявления. Однако, они не могут быть использованы без инициализации.</p>
<h3 id="Пример_2">Пример:<br>
</h3>
<pre>num = 6;
num + 7;
var num;
/* не генерирует ошибку, так как num объявлен */
</pre>
<p>JavaScript "поднимает" только объявление, но не инициализацию. Если вы используете переменную, объявленную и проинициализированную после ее использования, то значение будет <code>undefined</code>. Два примера ниже демонстрируют это поведение.<br>
</p>
<pre>var x = 1; // Инициализируем x
console.log(x + " " + y); // '1 undefined'
var y = 2;
//код выше и код ниже одинаковые
var x = 1; // Инициализируем x
var y; // Объявляем y
console.log(x + " " + y); // '1 undefined'
y = 2; // Инициализируем y
</pre>
<p> </p>
<h3 id="Technical_reference">Technical reference</h3>
<ul>
<li><a href="https://www.udemy.com/understand-javascript/">JavaScript: Understanding the Weird Parts</a> - Udemy.com Course</li>
<li><a href="/ru/docs/Web/JavaScript/Reference/Statements/var">var - объявление переменной</a> - MDN</li>
<li><a href="/ru/docs/Web/JavaScript/Reference/Statements/function">Функция</a> - MDN</li>
</ul>
|
