Detailed explanation of the difference between local variables and global variables in javascript_javascript skills

Javascript has two types of variables: local variables and global variables. Of course, our article is to help you truly distinguish between these two variables.

First of all, local variables can only be called within the function where this variable is declared. Global variables are variables that can be called throughout the code. Of course, it is definitely not clear to understand it literally. Let me introduce it in detail below:
As we all know, variables need to be declared with the var keyword. But variables can also be used implicitly in JavaScript, that is, they can be used directly without declaration. Moreover, be sure to note that JavaScript always uses implicitly declared variables as global variables.
For example:

Copy code The code is as follows:

function myName() {
i = 'yuanjianhang';
}
myName();
function sayName() {
alert(i);
}
sayName();

The output result is: yuanjianhang

This shows that variable i is a global variable. If the above code is changed to the following:

Copy code The code is as follows:

function myName() {
var i='yuanjianhang';
}
myName();
function sayName() {
alert(i);
}
sayName();

At this time, the browser will not have any output results, because i is defined in the function myName, so it is only a local variable of myName and cannot be called externally.

Now look back at the following code:

Copy code The code is as follows:

function myName() {
i = 'yuanjianhang';
}
myName();
function sayName() {
alert(i);
}
sayName();

Now, let’s make some changes and remove myName();. The code is as follows:

Copy code The code is as follows:

function myName() {
i = 'yuanjianhang';
}
function sayName() {
alert(i);
}
sayName();

At this time, the browser will not respond. Because although i is a global variable, the function myName() has not been called, so it is equivalent to declaring i but not assigning any value to i, so there is no output.
In the same way, if the above example is changed to:

Copy code The code is as follows:

function myName() {

i = 'yuanjianhang';
}
function sayName() {
alert(i);
}
sayName();
myName();

In this case, no results will be output. The JavaScript code is executed from top to bottom. When the sayName() function is called, the value of the variable i will be checked. At this time, the function myName has not yet been executed, that is to say i has not been assigned a value yet, so no results will be output.

In order to facilitate everyone’s better understanding, here is another example:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
i = 'guanxi';
}
myloveName();
function myName() {
alert(i);
}
myName();

What is the result this time?
The answer is guanxi
First, the original value of i is yuanjianhang, but after calling the myloveName() function, the value of i is changed to guanxi, so the final output result is guanxi.

If you change the code to:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
var i = 'guanxi';
}
myloveName();
function myName() {
alert(i);
}
myName();

The result at this time is yuanjianhang, because the two i's in the code are different, one is global and the other is local. It can also be understood this way. Although the names of the two i's are the same, the The essence is different, just like there are two people with the same name. Although the names are the same, they are not the same person.

If you change the code to this:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
i = 'guanxi';
}
function myName() {
alert(i);
}
myName();
myloveName();

I believe you can calculate the result by yourself, and the result is yuanjianhang.

Since global variables can be called inside the function, what about the following situation:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
i = 'guanxi';
alert(i);
}
myloveName();

What is the value of the variable at this time?

Let’s analyze it:

First, the global variable i is assigned the value: yuanjianhang.

Then the myloveName() function is called, and the global variable i is reassigned a new value: guanxi

So the result must be: guanxi.

What if we advance the alert, like this:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
alert(i);
i = 'guanxi';
}
myloveName();

What is the result at this time?
The verified result is: undefined
What if the code is like this:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
alert(i);
}
myloveName();

The result of i at this time is: yuanjianhang

Why does the above undefined situation occur? Because the execution order of the code is from top to bottom, and i is not defined before i is output. So it can be seen from here that when using code, the declaration of variables must be placed at the front of the code to avoid similar problems!

Similarly:

Copy code The code is as follows:

var i = 'yuanjianhang';
function myloveName() {
alert(i);
var i = 'guanxi';

}
myloveName();

In this case it will also output: undefined

Okay, I only have so much introduction about variables. I believe anyone can understand these. No matter how the code is copied, its core will not change.

The above is the entire content of this article. Do you guys have a deeper understanding of the difference between local variables and global variables in JavaScript? I wish you all a happy new year and happy learning.