Geek Answers Handbook

Block scope, scope, and local scope in Javascript

  • Is the block area sometimes the same as the function area? I know that a function area is intended for everything inside a function, but does not understand what a block area is.
  • For Javascript, is it currently recommended to use let / const instead of var for further maintenance? (This was from the Airbnb Style Guide )
+5
source share
3 answers

I am not sure that you have received answers to all your questions:

Is the block area sometimes the same as the function area? I know that the function area is intended for everything inside the function, but it doesn’t work out exactly what the block area is.

Yes , the scope of the block sometimes coincides with the scope of the function. { a block scope here } is everything inside a set of curly braces { a block scope here } . Thus, at the top of the functional code, the block area will be the same as the function area:

 function test(x) { // this is both a block scope and a function scope let y = 5; if (x) { // this is a smaller block scope that is not the same as the function scope let z = 1; } }

For Javascript, is it currently recommended to use let / const instead of var for future maintenance? (This was from the Airbnb Style Guide)

let and const are part of the latest ES6 specification and are implemented only in the latest Javascript engines, and sometimes in the latest versions, which are only activated by special flags. They come to all new JS engines / browsers, but not yet deployed. Thus, if you write Javascript for normal browser use on the wide web, you cannot reliably use let and const .

In some cases, you can safely program with let and const now:

  • If you focus only on a specific Javascript engine, and know that it supports these functions (for example, a specific version of nodejs or a plug-in only for a specific version of a specific browser).

  • If you use a transpiler that converts your code to code that will work in all browsers. When using the transpiler, you can write your code using the latest functions, and the transpiler will be "drowned out" so that your code works in old browsers using simulations of new functions.

If you are programming an environment in which you know that let and const supported, then it is advisable to use them as needed. If you declare a variable at the top of your function, let and var will do the same.

If you declare a variable in a smaller area inside a function, then let will be contained within a smaller area, but var will be raised to the beginning of the function and will have the scope of the function, regardless of where it is declared.

The AirBnb style guide you are associated with is specifically written for the ES6 environment (note that there is a separate link for the ES5 version of their style guide). Thus, this means that they assume an environment that supports ES6. This is either because they are aimed at the server-side JS engine, which they know is ES6-capable, or because they use a transpiler that converts the ES6 code to something that will run on the ES5 engine.

Note on transpilers. . Before you use the transpiler and switch all variable declarations to let within the blocks, you should understand what code the transpiler generates and whether it generates additional code has any effect on the performance of your application. For example, the block area for let modeled by creating a built-in IIFE that can lead to additional run-time overhead for each block that contains the let statement. I'm not saying that this is necessarily bad, which should prevent you from using the transpiler, but when deciding whether to use the transpiler, I would advise you to carefully look at what the converted code looks like for many ES6 so that you know if It is the right tool for any job that you have, or only for certain tasks.

+2
source
  • javascript 5 does not use a locked region that uses a bound region. the main difference is that you cannot access a variable outside the scope unless you make it global. ES 6 blocks the scope when you declare a variable with let.
  • Var is currently recommended, as ES 6 is not fully supported.
+7
source

Is the block area sometimes the same as the function area? I know that a function area is intended for everything inside a function, but does not understand what a block area is.

A block area is all that is inside a block, for example:

 function foo() { // function scope if (condition) { // block scope } }

According to the specification of the 5th edition, JavaScript did not have a block area. The following specification (ECMAScript 6, aka "ES6"), which is almost complete, adds a block area via let and const .

For Javascript, is it currently recommended to use let / const instead of var for future maintenance?

This is purely up to you. let and const are new tools that you can add to your belt. They should not replace var if you do not want to. However, you hear " let is the new var ".

Variables declared with let have the scope of the block declared with var .

Note that let and const do not have much support in the wild . Not surprisingly, adding a block area to an engine that has never had it before is apparently nontrivial. You can use a transpiler like Babel, or just keep using var .

+3
source

More articles:


All Articles