The most easy-to-understand explanation of javascript variables and the explanation of javascript Variables

Source: Internet
Author: User

The most easy-to-understand explanation of javascript variables and the explanation of javascript Variables

As follows:

a = 'ghostwu';var a;console.log( a );

Before I talk about variable escalation and the rule for variable escalation, or you have not learned about variable escalation, if you understand the existing javascript, for the above example, you may think that the output result of the 3rd line of code should be undefined, because the second line is var a; the variable is declared, but no value is assigned, so the value of a is undefined, but the correct result is ghostwu. as for why, please continue reading it!

console.log( a );var a = 'ghostwu';

For the first line of code in the above example, you may think that an error is returned because no variable a is defined before output of a, but the correct result is undefined. well, it seems a bit strange. javascript is too bad.

First, we need to clarify the following two points:

The javascript code is not executed in one row.

Javascript execution is divided into two steps:

Compile (lexical explanation/pre-explanation)

Run

Secondly, when we encounter var a = "ghostwu" to define a variable, js regards this sentence as a two-phase event. var a occurs in the compilation phase, a = 'ghostw' occurs in the execution phase. then var a will be promoted to the beginning of the current scope, and a = 'ghostw' will remain in the original place waiting for the execution phase, so:

A = 'ghostw'; var a; console. log (a); // After the code above is compiled, it becomes var a as follows; // It is promoted to the front of the current scope a = 'ghostw '; // stay in the same place and wait for the console to be executed. log ();
Console. log (a); var a = 'ghostw'; // the above Code, after compilation, becomes var a; console. log (a); a = 'ghostw ';

Do you understand the compiled code?

Before talking about the following, we should first define two common methods of defining functions:

// Function declaration, such as function show () {console. log ('function declaration method');} // function expression, such as var show = function () {console. log ('Expression method ');}

Because expressions and function declarations produce different interpretations in the compilation phase.

show();  function show(){   console.log( a );   var a = 'ghostwu';  }

How can I explain the above Code in the compilation phase? Remember the following sentence:

Function declaration will be promoted

Therefore, after the above Code is compiled, it becomes as follows:

Function show () {// The function declaration is promoted to the front of var a in the current scope; // The var declaration is promoted to the front of the current scope. Note, it will not be promoted to the outside of the function, because the current scope is in the function console. log (a); a = 'ghostw';} show ();

Therefore, the above result is undefined;

Function expressions are not upgraded. See the following example:

Show (); // error, show is not a functionvar show = function () {console. log ('ghostwu');} // For the above Expression Code, after compilation: var show; show (); // after execution, it is undefined (), so before the expression is defined, the show = function () {console error is returned when the function is called. log ('ghostw ');}
Show (); // You var show; function show () {console. log (' ');} show = function () {console. log ('hello ');}

Why is the result of the above Code 'Hello '?

Because: When a function declaration with the same name appears, the function declaration will give priority to the variable declaration, and the variable declaration will be ignored. So after compilation, it becomes:

Function show () {console. log (' ');} show (); // Hello show = function () {console. log ('hello');} show (); // if this is called once, it is "hello", because the show function is assigned a value again during the execution phase.

If there is a function declaration with the same name, the subsequent statement will overwrite the previous one, as shown below:

Show (); // how are you var show; function show () {console. log ('hello');} show = function () {console. log (' ');} function show () {console. log ('How are you! ');} // After the above Code is compiled, it becomes the following form: function show () {console. log ('How are you! ');} Show (); // how are you show = function () {console. log (' ');} show (); // If you execute it again here, the result is: Hello.
// Question: What are the following results? Why? Write down your answer show (); var a = true; if (a) {function show () {console. log (1) ;}} else {function show () {console. log (2 );}}

The plain and easy-to-understand explanation of the javascript variable above is all the content shared by the editor. I hope to give you a reference and support for the help house.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.