JavaScript Scope


Scope is the collection of accessible variables.


JavaScript Scope

In JavaScript, objects and functions are also variables.

In JavaScript, scope is the set of accessible variables, objects, and functions.

JavaScript Function Scope: The scope is modified within the function.


JavaScript Local Scope

Variables declared inside a function are local variables and have local scope.

Local variables: can only be accessed within the function.

Examples

//The carName variable cannot be called here. function myFunction() { var carName = "Volvo"; //The carName variable can be called within the function. }

Try it Yourself »

Because local variables only work inside the function, different functions can use variables with the same name.

Local variables are created when the function starts executing, and are automatically destroyed after the function finishes executing.


JavaScript Global Variables

A variable defined outside a function is a global variable.

Global variables haveglobal scope: All scripts and functions on the web page can use them.

Examples

var carName = " Volvo"; //The carName variable can be called here. function myFunction() { //The carName variable can be called within the function. }

Try it Yourself »

If a variable is not declared inside a function (without using the var keyword), the variable is a global variable.

In the following example, carName is inside the function, but it is a global variable.

Examples

//The carName variable can be called here. function myFunction() { carName = "Volvo"; //The carName variable can be called here. }

Try it Yourself »


JavaScript Variable Lifecycle

The JavaScript variable lifecycle is initialized when it is declared.

Local variables are destroyed after the function finishes executing.

Global variables are destroyed after the page is closed.


Function Parameters

Function parameters only take effect inside the function and are local variables.


Global Variables in HTML

In HTML, global variables are the window object, so the window object can call local variables inside functions that are not declared (without var).

Note:All global variables belong to the window object.

Examples

//window.carName can be used here. function myFunction() { carName = "Volvo"; }

Try it Yourself »


Did you know?

Note Your global variables or functions can overwrite the variables or functions of the window object.
Local variables, including the window object, can overwrite global variables and functions.

In JavaScript, local variables inside a function usually cannot be directly accessed by the outer scope, but there are several ways to expose local variables in a function to the outer scope, as follows:

  • Through the global object:Inside a function, you can make a local variable globally accessible by assigning it to a property of the window object. For example, usingwindow.a = a;statement, you can access it outside the function viawindow.athe value of this local variable.
  • Defining global variables:Inside a function, when not usingvar、letorconstkeywords such as to declare a variable, the variable is treated as a global variable and can be accessed outside the function. However, this practice is generally not recommended because it may cause unexpected side effects and make the code difficult to maintain.
  • Return value:You can use inside a functionreturnstatement to return the value of a local variable, and then receive the return value outside the function. In this way, although the local variable itself is not exposed, its value can be passed to the outside through a function call.
  • Closures:The closure feature in JavaScript allows inner functions to access local variables of outer functions. Even after the outer function has finished executing, its local variables can still be referenced by the inner function.
  • Properties and methods:Variables and functions defined in the global scope become properties and methods of the window object, so when calling them, you can omit window and directly use the variable name or function name.
Other extensions