From a3eed3d269abae5eae341276764db5d0613a5964 Mon Sep 17 00:00:00 2001 From: Dilliya Date: Tue, 31 Mar 2026 19:51:44 +0400 Subject: [PATCH 1/3] =?UTF-8?q?1=20=D0=B8=203=20=D0=BC=D0=B0=D0=BA=D1=81?= =?UTF-8?q?=D0=B8=D0=BC=D0=B0=D0=BB=D1=8C=D0=BD=D0=BE=20=D0=BA=D1=80=D0=B8?= =?UTF-8?q?=D0=B2=D0=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 47 ++++++++++++++++++++- styles.css | 118 +++++++++++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 160 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 5e60e40..b0de659 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,56 @@ + Практика верстки + - +
+

Замыкания в JavaScript для начинающих

+ +

+ Замыкания — это одна из фундаментальных концепций JavaScript, вызывающая сложности у многих новичков, знать и понимать которую должен каждый JS-программист. Хорошо разобравшись с замыканиями, вы сможете писать более качественный, эффективный и чистый + код. А это, в свою очередь, будет способствовать вашему профессиональному росту. +

+ +

+ Материал, перевод которого мы публикуем сегодня, посвящён рассказу о внутренних механизмах замыканий и о том, как они работают в JavaScript-программах. +

+ +

Что такое замыкание?

+ +

+ Замыкание — это функция, у которой есть доступ к области видимости, сформированной внешней по отношению к ней функции даже после того, как эта внешняя функция завершила работу. Это значит, что в замыкании могут храниться переменные, объявленные во внешней + функции и переданные ей аргументы. Прежде чем мы перейдём, собственно, к замыканиям, разберёмся с понятием «лексическое окружение». +

+ +

Что такое лексическое окружение?

+ +

+ Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример: +

+ + лексическое окружение + +

+ Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, в области видимости функции outer() и в глобальной области видимости. Функция outer() имеет доступ к переменным, объявленным в её собственной области видимости + и в глобальной области видимости. +

+ +

+ Цепочка областей видимости вышеприведённого кода будет выглядеть так: +

+ + ещё умный код + +

+ Обратите внимание на то, что функция inner() окружена лексическим окружением функции outer(), которая, в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может получить доступ к переменным, объявленным в функции outer() + и в глобальной области видимости. +

+
+ \ No newline at end of file diff --git a/styles.css b/styles.css index 1cbd2e0..6d9f06d 100644 --- a/styles.css +++ b/styles.css @@ -1,8 +1,118 @@ -/* Тут пиши основные стили */ +.page_div { + width: 1600px; + padding: 30px 0 0 30px; + margin: 0 auto; +} +[main_header] { + font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; + font-weight: bold; + font-size: 42px; + color: rgba(0, 0, 0, 0.84); + text-align: center; + line-height: 44px; + margin-left: auto; + margin-right: auto; +} + +[definition1], +[definition2] { + font-family: Georgia, Cambria, "Times New Roman", Times, serif; + font-size: 21px; + color: rgba(0, 0, 0, 0.84); + text-align: left; + line-height: 22px; + width: 700px; + margin-left: auto; + margin-right: auto; +} + +[h2_header_what_tr], +[h2_header_what_lect_venv] { + font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; + font-weight: bold; + font-size: 34px; + color: rgba(0, 0, 0, 0.84); + text-align: left; + line-height: 39px; + width: 700px; + margin-left: auto; + margin-right: auto; +} + +[definition3], +[definition4], +[code_explanation1], +[code_explanation2], +[code_explanation3] { + font-family: Georgia, Cambria, "Times New Roman", Times, serif; + font-size: 21px; + color: rgba(0, 0, 0, 0.84); + text-align: left; + line-height: 33px; + width: 700px; + margin-left: auto; + margin-right: auto; +} + +[lect_env_img1] { + width: 700px; + height: 727px; + display: block; + margin-left: auto; + margin-right: auto; +} + +[img2] { + width: 700px; + height: 923px; + display: block; + margin-left: auto; + margin-right: auto; +} @media (max-width: 800px) { -/* Тут пиши стили для мобилки. - Стили применятся только когда страничка будет ≤800px шириной - */ + .page_div { + width: 100%; + padding: 20px; + } + [main_header], + [definition1], + [definition2], + [h2_header_what_tr], + [h2_header_what_lect_venv], + [definition3], + [definition4], + [code_explanation1], + [code_explanation2], + [code_explanation3] { + width: 100%; + max-width: 100%; + margin-left: 0; + margin-right: 0; + } + [main_header] { + font-size: 32px; + height: auto; + line-height: 1.2; + } + [h2_header_what_tr], + [h2_header_what_lect_venv] { + font-size: 28px; + line-height: 1.2; + } + [definition3], + [definition4], + [code_explanation1], + [code_explanation2], + [code_explanation3] { + font-size: 18px; + line-height: 1.4; + } + [lect_env_img1], + [img2] { + width: 100%; + height: auto; + max-width: 100%; + } } \ No newline at end of file From d607c0255b7c0c9d1694d83b62cc9248855e161c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A2=D0=B8=D0=BC=D0=BE=D1=84=D0=B5=D0=B9=20=D0=90=D1=80?= =?UTF-8?q?=D1=82=D0=B5=D0=BC=D1=8C=D0=B5=D0=B2?= Date: Tue, 31 Mar 2026 20:52:48 +0500 Subject: [PATCH 2/3] feathop --- index.html | 100 ++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 99 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index 5e60e40..c01da18 100644 --- a/index.html +++ b/index.html @@ -4,8 +4,106 @@ Практика верстки + - +
+
+ + + +
+
+ \ No newline at end of file From 0fce6ba3a411b4beda0a34e805cfd22ea9f8250e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=A2=D0=B8=D0=BC=D0=BE=D1=84=D0=B5=D0=B9=20=D0=90=D1=80?= =?UTF-8?q?=D1=82=D0=B5=D0=BC=D1=8C=D0=B5=D0=B2?= Date: Tue, 31 Mar 2026 20:58:00 +0500 Subject: [PATCH 3/3] LASTREWOREK --- index.html | 4 ++-- styles.css | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/index.html b/index.html index 86a5990..c19ad28 100644 --- a/index.html +++ b/index.html @@ -134,7 +134,7 @@

Что такое лексическое окруж Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример:

- лексическое окружение + лексическое окружение

Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, в области видимости функции outer() и в глобальной области видимости. Функция outer() имеет доступ к переменным, объявленным в её собственной области видимости @@ -145,7 +145,7 @@

Что такое лексическое окруж Цепочка областей видимости вышеприведённого кода будет выглядеть так:

- ещё умный код + ещё умный код

Обратите внимание на то, что функция inner() окружена лексическим окружением функции outer(), которая, в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может получить доступ к переменным, объявленным в функции outer() diff --git a/styles.css b/styles.css index 6d9f06d..224895b 100644 --- a/styles.css +++ b/styles.css @@ -1,7 +1,7 @@ .page_div { width: 1600px; padding: 30px 0 0 30px; - margin: 0 auto; + margin: 38 auto; } [main_header] {