Рубрики
Без рубрики

Функция, блок и лексическая область. Какая разница?

Что такое масштаб? Область – это место, где определяется переменная, и контекст, где другие части … с меткой Codenewbie, JavaScript.

Что такое масштаб?

Область – это место, где определяется переменная, и контекст, где другие части вашего кода могут доступ и манипулировать Это. В этом посте я намечу три различных типа областей и то, как они ведут себя в JavaScript.

Функциональная область

В приведенном ниже примере функция, называемая Helpme, имеет переменную, называемую MSG. MSG – это Функция Scoped Это означает, что если вы наздите это вне функции Helpme, вы получите неопределенную.

Если у вас есть две переменные с тем же именем, их местоположение имеет значение. В приведенном ниже примере переменная птицы объявляется за пределами функции (розовая коробка), а затем переменная птицы функционирует на часе птиц. Когда птица находится вне функции, печатается «утка мандарина».

Блок область применения

Блоки кода определены с вьющимися скобками. Важно отметить, что пусть и const являются Блок Обзор. Это означает, что когда вы объявляете переменную, используя let или const, эти переменные не могут быть доступны за пределами этого блока.

Напротив, если вы используете var Вы все еще можете получить доступ к переменной, которая объявляется внутри области блока.

// let & const are BLOCK SCOPED

if (true) {
const animal = 'eel';
console.log(animal); //'eel'
}
console.log(animal); //NOT DEFINED!

// Var is not BLOCK SCOPES
if (true) {
var animal = 'eel';
console.log(animal); //'eel'
}
console.log(animal); //'eel'

Лексическая область

Лексическая область относится к тому факту, что вложенные функции охватывают их родительские/внешние функции (Но это односторонние отношения).

В приведенном ниже примере внутренняя функция вложена внутри внешней функции. Как вы можете видеть, у нас есть доступ к герою во внутренней функции. Но за пределами этой функции мы не имеем доступа к внутреннему.

Ниже приведен еще один пример того, как работает лексическая область. Когда мы называем Outter () приведенный ниже пример распечатывает «Amadeus». Это связано с тем, что фильм не определен внутри функции ресурса, поэтому функция ищет ближайший фильм, который является Amadeus. Если сияние не было прокомментировано, консоль печатает ее.

function outer() {
  let movie = 'Amadeus';

 function inner() {
   // let movie = "The Shining"; 

   function extraInner() { 
   //movie is not defined in this function 
   //but it has access to parent function's variables
     console.log(movie.toUpperCase()) 
   } 
    extraInner();
  }
  inner();
}

outer(); //'AMADEUS'

--------
//Order of how the function is called

2. function outer() {
   3. let movie = 'Amadeus';

  5. function inner() {
     6. let movie = "The Shining";

     8. function extraInner() {
        9. console.log(movie.toUpperCase())
    }
    7. extraInner();
    }
4. inner();
}
 
1. outer();
 
10. >>>'THE SHINING'

Первоначально опубликовано здесь.

*Графика – скриншоты из современного курса JavaScript от Colt Steele.

Оригинал: “https://dev.to/ellawilksharper/function-block-and-lexical-scope-what-s-the-difference-575k”

Читайте ещё по теме: