JavaScript Advanced Programming Learning ① What does complete JavaScript include? What are the uses, similarities and differences of var, let and const? Why is it better to use let in for loop? What are Undefined, Null, and NaN respectively?

1. What does complete JavaScript contain? What do they mean?

1.1 The complete JavaScript contains three parts

Core ECMAScript, Document Object Model DOM, Browser Object Model BOM

 

1.2 The meaning of the three parts of JavaScript

1.2.1 ECMAScript

ECMA-262 defines the syntax, types, statements, keywords, reserved words, operators, and global objects of a language; ECMA-262 has iterated many versions. For example, the sixth edition of ECMA-262 is commonly known as ES6.

ECMAScript is a language defined by ECMA-262 and is the name given to a language that implements all aspects described in this specification.

JavaScript implements ECMAScript.

1.2.2 DOM Document Object Model

The Document Object Model (DOM) is an application programming interface for using extended XML in HTML.

DOM abstracts the entire page into a set of hierarchical nodes.

<html>
	<head> 
		<title>Page Title</title>
	</head>
	<body>
		<p>Hello World</p>
	</body>
</html>

Code can be represented as a set of hierarchical nodes through DOM.

1.2.3 BOM Browser Object Model

The Browser Object Model (BOM), used to support accessing and manipulating the browser's windows. Using the BOM, developers can control parts of the page other than what the browser displays. The core of the BOM is the Window object, which represents an instance of the browser.

2. What are the uses, similarities and differences of var, let and const?

2.1 Overview of similarities and differences between var, let, and const

Declarable variables Scope variable promotion redundant statement Need to initialize variables Unchangeable
was all types function scope × ×
let all types block scope × × × ×
const all types block scope × ×

2.2 Details and usage of similarities, differences and usage of var, let and const

2.2.1 Scope

The scope of var is function scope, that is, once declared in a function, it can be used in the entire function.

The scope of let and const is block scope, that is, if let is defined in {}, it cannot be accessed outside {}.

Examples of var, let and const scopes are given below. For variables declared by var, you can see that even if they are declared within a block, the entire function can be accessed. Of course, its scope is only limited to the current function test() among.

function test() {
    if (true) {
        var a = "HelloWorld"
        console.log("块内声明:" + a)
    }
    console.log("块外:" + a)
}
test()
console.log("函数作用域外:" + a)

 For variables declared by let and const, they can only be accessed in the current block and cannot be accessed in the current function scope or outside the function scope.

function test() {
    if (true) {
      //const a = "HelloWorld"
        let a = "HelloWorld"
        console.log("块内声明:" + a)
    }
    console.log("块外:" + a)
}
test()
console.log("函数作用域外:" + a)

 

2.2.2 Variable promotion

There is variable promotion in var, that is, using var will automatically promote the variables defined by var to the top of the function scope.

There is no variable promotion for let and const.

Examples of var, let and const variable promotion are given below. Var variable promotion means that variables declared using this keyword will be automatically promoted to the top of the function scope, and no error will be reported, but undefined will be displayed.

console.log(a)
var a = "HelloWorld"
console.log(a)

 That is, the above line of code is equivalent to the following code:

var a
console.log(a)
var a = "HelloWorld"

There is no variable promotion for let and const. If this variable is not defined before using it, an error will be reported directly.

console.log(a)
let a = "HelloWorld"
// const a = "HelloWorld"

 2.2.3 Redundant declarations

var can be declared redundantly, but let and const are not allowed to be declared redundantly.

Redundant declaration refers to repeatedly declaring the same variable multiple times, and var allows redundant declarations.

var a = "1"
var a = "2"
var a = "3"
console.log(a)

 

 Let and const do not allow redundant declarations and will directly report an error.

let a = "1"
let a = "2"
//const a = "1"
//const a = "2"
console.log(a)

 

 2.2.4 Initializing variables and modifications

 When a const variable is declared, the variable must be initialized and the const value cannot be modified.

const a 

 

 

const a = 1;
	  a += 2;

 

 

3. Why is it better to use let instead of const or var in for loop?

3.1 There is variable penetration in var, and strange errors will occur when using timers.

3.1.1 Variable penetration

The so-called variable penetration is because the scope of var is the entire function scope, and i defined through var will be defined in the entire function. Rather than just being defined in this loop body.

for (var i = 0; i < 3; i++) {

}
console.log(i);

 

 

3.1.2 Timer “error”

At the same time, if a timer is added to the loop and the value of i needs to be manipulated, then only the value of i that leads to the end of the loop can be obtained.

for (var i = 0; i < 3; i++) {
    setTimeout(() => { console.log(i) }, 0)
}

3.2 Const does not allow modification by definition, and an error will be reported directly when used as i for loop counting.

for (const i = 0; i < 3; i++) {
}

 

 3.3 Using let can perfectly avoid the above three problems, so it is best to use let in the for loop.

When let is used to define i in a for loop, the variables referenced by the function in the timer are new variables declared by the JavaScript engine for each iteration, instead of directly printing the i value at the end. At this time, the problem of variable penetration will not occur. , i will not act outside the function.

for (let i = 0; i < 3; i++) {
    setTimeout(() => { console.log(i) }, 0)
}
console.log(i)

 

 

4. What are Undefined, Null and NaN respectively?

4.1 Undefined

When a variable is declared using var or let but not initialized, it is equivalent to assigning an undefined value to the variable.

let a
var b
console.log(a)
console.log(b)

 

 

4.2 Null

The null value represents a null object pointer. Use typeof to return null object.

console.log(typeof(null))

 

undefined is derived from null. ECMA-262 defines them as superficially equal, that is, null==undefined will return true, but of course they are not exactly equal.

console.log(undefined == null)
console.log(undefined === null)

 

 

4.3 NaN

NaN (Not a Number) is a special value used to indicate that the operation that was supposed to return a value failed. Division by 0, +0 or -0 returns NaN

For example, 0/0 will return NaN, and 3/0 will return Infinity.

console.log(0/0)
console.log(3/0)

 

NaN will also appear in strange situations when comparing sizes.

console.log(NaN > 3);
console.log(NaN <= 3);
console.log(NaN == NaN);
console.log(NaN === NaN);
console.log(NaN != NaN);

NaN is neither greater than 3 nor equal to 3, nor is it equal to itself, nor is it completely equal to itself.  

 

 

5. Relational operators, why does 3 > 23 appear?

After these four lines of code are executed, one line will return false, that is, a strange "23 < 3" will appear.

console.log("23" > "3");
console.log(23 > "3");
console.log("23" > 3);
console.log(23 > 3);

 

When "23" and "3" are both strings, their character codes will be gradually compared. The code 50 of "2" is less than the code 51 of "3", which means false will be returned.

In other cases, when it contains a numerical value, the string will be converted into a numerical value and then compared.

Guess you like

Origin blog.csdn.net/zujiasheng/article/details/126858300