83 lines
4.0 KiB
Markdown
83 lines
4.0 KiB
Markdown
---
|
||
sidebar_position: 3
|
||
---
|
||
|
||
# Function Expression
|
||
|
||
**Function Declaration (Объявление Функции):**
|
||
|
||
```js
|
||
function sayHi() {
|
||
alert( "Привет" );
|
||
}
|
||
```
|
||
|
||
**Function Expression (Функциональное Выражение).**
|
||
|
||
```js
|
||
let sayHi = function() {
|
||
alert( "Привет" );
|
||
};
|
||
```
|
||
|
||
## Функция – это значение
|
||
|
||
Давайте повторим: независимо от того, как создаётся функция – она является значением. В обоих приведённых выше примерах
|
||
функция хранится в переменной sayHi.
|
||
|
||
```js
|
||
function sayHi() {
|
||
alert( "Привет" );
|
||
}
|
||
|
||
alert( sayHi ); // выведет код функции
|
||
```
|
||
|
||
## Функции-«колбэки»
|
||
|
||
Ключевая идея в том, что мы передаём функцию и ожидаем, что она вызовется обратно (от англ. «call back» – обратный
|
||
вызов) когда-нибудь позже, если это будет необходимо.
|
||
|
||
## Function Expression в сравнении с Function Declaration
|
||
|
||
- Function Declaration: функция объявляется отдельной конструкцией «function…» в основном потоке кода.
|
||
- Function Expression: функция, созданная внутри другого выражения или синтаксической конструкции. В данном случае
|
||
функция создаётся в правой части «выражения присваивания» **=**
|
||
|
||
#### 💥 Более тонкое отличие состоит в том, когда создаётся функция движком JavaScript.
|
||
|
||
***Function Declaration может быть вызвана раньше, чем она объявлена.***
|
||
|
||
```js
|
||
sayHi("Вася"); // Привет, Вася
|
||
|
||
function sayHi(name) {
|
||
alert( `Привет, ${name}` );
|
||
}
|
||
```
|
||
|
||
***Function Expression создаётся, когда выполнение доходит до него, и затем уже может использоваться.***
|
||
```js
|
||
sayHi("Вася"); // ошибка!
|
||
|
||
let sayHi = function(name) { // (*) магии больше нет
|
||
alert( `Привет, ${name}` );
|
||
};
|
||
```
|
||
|
||
Ещё одна важная особенность Function Declaration заключается в их блочной области видимости.
|
||
|
||
В строгом режиме, когда Function Declaration находится в блоке \{...\}, функция доступна везде внутри блока. Но не
|
||
снаружи него.
|
||
|
||
- Функции – это значения. Они могут быть присвоены, скопированы или объявлены в любом месте кода.
|
||
- Если функция объявлена как отдельная инструкция в основном потоке кода, то это “Function Declaration”.
|
||
- Если функция была создана как часть выражения, то это “Function Expression”.
|
||
- Function Declaration обрабатываются перед выполнением блока кода. Они видны во всём блоке.
|
||
- Функции, объявленные при помощи Function Expression, создаются только когда поток выполнения достигает их.
|
||
|
||
В большинстве случаев, когда нам нужно объявить функцию, Function Declaration предпочтительнее, т.к функция будет видна
|
||
до своего объявления в коде. Это даёт нам больше гибкости в организации кода, и, как правило, делает его более
|
||
читабельным.
|
||
|
||
🚀 **Источник: [https://learn.javascript.ru/function-expressions](https://learn.javascript.ru/function-expressions)** |