table of Contents
P1 01. Shang Silicon Valley_JS Advanced_Preparation 07:07
WebStrom download and installation
2. WebStrom download (official website)
3. WebStrom download (Baidu network disk)
P2 02. Shang Silicon Valley_JS Advanced_Data Type 40:43
P3 03. Shang Silicon Valley_JS Advanced_ Related Questions 20:31
1. What is the difference between undefined and null?
2. When do you assign null to a variable?
3. Strictly distinguish between variable type and data type?
P4 04.Silicon Valley_JS Advanced_Data_Variable_Memory 47:39
4. The relationship between memory, data, and variables.
P5 05. Shang Silicon Valley_JS Advanced_ Related Questions 1 24:22
Situation discussion: var a = xxx (assignment operation), what exactly is stored in a memory?
About reference variable assignment
P6 06. Shang Silicon Valley_JS Advanced_ Related Question 2 25:38
About reference variable assignment
P7 07. Shang Silicon Valley_JS Advanced_Object 23:30
4. How to access the internal data of the object?
5. When must the ['attribute name'] method be used?
P8 08. Shang Silicon Valley_JS Advanced_Function 15:59
P9 09. Shang Silicon Valley _JS advanced _ callback function 09:54
P10 10.Silicon Valley_JS Advanced_IIFE 14:49
P11 11. This in Silicon Valley_JS advanced_function 10:50
P12 12.Silicon Valley_JS Advanced_About sentence semicolon problem 18:38
P13 13.Silicon Valley_JS advanced_webstorm settings 23:02
P14 14.Silicon Valley_JS Advanced_Review 55:51
P1 01. Shang Silicon Valley_JS Advanced_Preparation 07:07
WebStrom download and installation
Bilibili website video: [Share] WebStorm2020.1 installation tutorial-Windows
1. Uninstall WebStorm
2. WebStrom download (official website)
3. WebStrom download (Baidu network disk)
- [Link: https://pan.baidu.com/s/1-iVrlbLbvx8MX4UZT5lIeA extraction code: zjxs]
JS advanced Xmind mind map
WebStorm import file
P2 02. Shang Silicon Valley_JS Advanced_Data Type 40:43
Data type classification
Basic (value) type
- Number: any number
- String: arbitrary text
- Boolean：true / false
- undefined：undefined
- null ： null
Object (reference) type
- Object: any object ([], function...)
- Array: Special object type (numerical index / internal data ordered)
- Function: Special object type (executable)
Data type judgment
typeof
- Returns the string representation of the data type ;
- Can be distinguished: numeric value, string, boolean, undefined, function;
- Can not distinguish: null and object, general object and array.
instanceof
- Specially used to determine the type of object data: Object, Array and Function.
===
- Can judge: undefined and null.
=== Can be judged: undefined and null. The default value is unique ---> undefined: undefined; null: null.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>01_数据类型</title>
</head>
<body>
<script type="text/javascript">
var b1 = { // 对象类型
b2: [1, 'abc', console.log],
b3: function () {
console.log('b3')
return function () {
return 'xfzhang'
}
}
}
console.log(b1 instanceof Object, b1 instanceof Array) // true false
console.log(b1.b2 instanceof Array, b1.b2 instanceof Object) // true true
console.log(b1.b3 instanceof Function, b1.b3 instanceof Object) // true true
console.log(typeof b1.b3 === 'function') // true
console.log(typeof b1.b2[2] === 'function') // true
b1.b2[2](4) // 4
console.log(b1.b3()()) // xfzhang
console.log(typeof Array) // function
console.log(typeof b1.b2) // object
console.log(typeof b1.b2[2]) // function
console.log("---")
console.log(b1.b2[2](4)) // 4 undefined
console.log("--- ---")
console.log(b1.b2[2]) // ƒ log() { [native code] }
console.log("--- --- --- ---")
console.log(b1.b2[2]('abc')) // 'abc' undefined
console.log("--- --- ---")
console.log(b1.b3()) // b3 ƒ (){ return 'xfzhang' }
</script>
</body>
</html>P3 03. Shang Silicon Valley_JS Advanced_ Related Questions 20:31
Instance
Objects created with the same constructor are called a class of objects, and a constructor is also called a class. We will use a constructor to create an object called an instance of this class.
1. What is the difference between undefined and null?
1. What is the difference between undefined and null?
undefined means the definition is not assigned; null is defined and assigned, but the value is null.
2. When do you assign null to a variable?
2. When do you assign null to a variable?
The initial assignment indicates that the object will be assigned; before the end, the object becomes a garbage object (collected by the garbage collector). Initialization assignment: It will be used as a reference variable, but the object has not been determined yet. At the end: The object pointed to by the variable becomes a garbage object.
var a = null // a will point to an object, but the object has not been determined at this time
a = null // Let the object pointed to by a become a garbage object
3. Strictly distinguish between variable type and data type?
3. Strictly distinguish between variable type and data type?
The variable of js has no type. The type of the variable is actually the type of the data in the variable memory (js is a weakly typed language). var a; Judging the type of the variable is actually the type of the value.
Type of data (data object):
* basic type
* object typeVariable type (variable memory value type):
* Basic type: save basic type data (a variable that saves basic type data).
* Reference type: save the object address value (a variable that saves the object address value).
P4 04.Silicon Valley_JS Advanced_Data_Variable_Memory 47:39
1. What is data?
The'dongdong', which represents specific information stored in the memory, is essentially 0101 (binary)...
the characteristics of data: it has the basic characteristics of readable, transmittable, and operable .
Everything (everything) is data, and functions are also data.
The goal of all operations in the memory (program): data
* arithmetic operation
* logic operation
* assignment
* running function (call function transfer parameter)
...
2. What is memory?
The data storage space (temporary) generated after the memory module is powered on.
Memory generation and death: Memory module (integrated circuit board) ==> power-on ==> a certain capacity of storage (memory) space ==> storage of various data ==> processing data ==> power failure ==> memory and All data disappeared
The memory space is temporary, while the hard disk space is persistent.
A piece of memory contains 2 data
* internally stored data (general data/address data)
* memory address value data
memory classification
* stack: global variables/local variables (space more Small)
* Heap: Object (larger space)
3. What is a variable?
The amount by which the value can be changed is composed of variable name and variable value.
A variable corresponds to a small memory, the variable name is used to find the corresponding memory, and the variable value is the content stored in the memory.
4. The relationship between memory, data, and variables.
Memory is a container used to store the data needed to operate the program (memory is the space used to store data).
Variables are the identification of memory. We find the corresponding memory through variables, and then manipulate (read/write) the data in the memory.
P5 05. Shang Silicon Valley_JS Advanced_ Related Questions 1 24:22
Situation discussion: var a = xxx (assignment operation), what exactly is stored in a memory?
Question: var a = xxx (assignment operation), what exactly is stored in a memory?
- xxx is a basic data, and this data is saved.
- xxx is an object, and it stores the address value of the object.
- xxx is a variable, the memory content of xxx saved (the saved data may be basic data or address value data).
About reference variable assignment
About reference variable assignment
- Two reference variables point to the same object (the saved content is the address value of the same object). One reference variable is used to modify the internal data of the object, and the other reference variable is also visible (see the modified data).
- Two reference variables point to the same object, so that one reference variable points to another object, and the other reference variable points to the original object.
This figure is for the first explanation.
This figure is for the second explanation.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>02_关于引用变量赋值问题</title>
</head>
<body>
<script type="text/javascript">
//1. 2个引用变量指向同一个对象, 通过一个引用变量修改对象内部数据, 另一个引用变量也看得见
var obj1 = {}
var obj2 = obj1
obj2.name = 'Tom'
console.log(obj1.name) // Tom
function f1(obj) {
obj.age = 12
}
f1(obj2)
console.log(obj1.age) // 12
//2. 2个引用变量指向同一个对象,让一个引用变量指向另一个对象, 另一个引用变量还是指向原来的对象
var obj3 = {
name: 'Tom'
}
var obj4 = obj3
obj3 = {
name: 'JACK'
}
console.log(obj4.name) // Tom
function f2(obj) {
obj = {
name: 'Bob'
}
}
f2(obj4)
console.log(obj4.name) // Tom
var a = {age: 12}; // 2个引用变量指向同一个对象
var b = a; // 2个引用变量指向同一个对象
a = {name: 'Bob', age: 13}; // 将新的对象赋值给a
b.age = 14; // 另一个引用变量还是指向原来的对象
console.log(b.age, a.name, a.age); // 14 "Bob" 13
function fn2 (obj) {
obj = {age: 15}; // 新的对象（垃圾对象）
}
fn2(a); // 函数执行完，函数内部的局部变量(obj)会自动释放
//总结：obj引用的地址值发生改变，不再引用传进来的形参地址，并且函数作用域的原因，这个对象只能在函数内使用。
console.log(a.age); // 13
</script>
</body>
</html>P6 06. Shang Silicon Valley_JS Advanced_ Related Question 2 25:38
About reference variable assignment problem
The heap address stored in obj and a is the same, and the heap address assigned to obj in the next step has changed, but it has not changed the contents of the heap address stored in a before.
It is to copy the content of a to the function parameter obj, but obj points to the new object inside the function, but does not affect the object pointed to by a.
After the function parameters are passed in, the value of a is copied to obj, and the two stack memories point to the data in one heap memory. Afterwards, obj={age:15}, at this time: obj points to another heap memory. These two heap memories are different. Modifying age with obj will not affect the age pointed to by a.
About data transfer problems
Question: When passing variable parameters when js calls a function, is it passed by value or by reference?
- Understanding 1: Both are value (basic/address value) transfer.
- Understanding 2: It may be passed by value or passed by reference (address value).
- There is only value transfer, no reference transfer. What is transferred is the value of the variable, but the value may be basic data or address (reference) data.
- If the latter is regarded as passing by reference, then passing by value and passing by reference are both possible.
Because the a in the function is a local variable in the function, replace it with this.a = a + 1, this time this.a is the a you defined at the beginning.
Assuming that the formal parameter is x, two things happen when calling the function to pass the parameter: 1. Read the value of the global variable a; 2. Assign the value to x, and then execute the code in the function.
The a in parentheses is the global value of a copied to him.
Memory management
Question: How does the JS engine manage memory?
1. Memory Life Cycle
- Allocate a small memory space and get the right to use it (allocate the required memory).
- Store data, you can repeat the operation (using the allocated memory).
- Release small memory space (release/return it when not needed).
2. Free up memory
- Local variables: automatically released after the function is executed (stack space memory allocated for executing the function).
- Object: becomes a garbage object ==> garbage collector reclaims (heap space memory for storing objects: when the memory is not referenced, the object becomes a garbage object, and the garbage collector will reclaim and release this memory later.)
var a = 3; var obj = {}; // Occupies 3 spaces, 2 stack areas and one heap area: a = 3, obj, {} (the object takes up the largest space).
obj = null; // Occupies 2 spaces, the space occupied by {} is reclaimed.
If obj is equal to any value, the connection to the heap is cancelled, so the heap becomes garbage, and the obj on the stack side is still equal to any value, and the global variable obj is not released.
P7 07. Shang Silicon Valley_JS Advanced_Object 23:30
1. What is an object?
1. What is an object?
- Encapsulation body (aggregate) of multiple data.
- A container for storing multiple data.
- An object represents a thing in reality (representing a certain thing in reality, which is an abstraction of that thing in programming).
2. Why use objects?
2. Why use objects?
- It is convenient for unified management of multiple data.
3. Object composition
3. The composition of an object The functions in an object are methods; the strings, numbers, etc. in the object are called attributes.
- Attribute: It is composed of attribute name (string) and attribute value (arbitrary). (Represents the state data of real things; the attribute names are all string types, and the attribute values are of any type)
- Method: a special attribute (the attribute value is a function). (Behavior data representing real things)
4. How to access the internal data of the object?
4. How to access the internal data of the object?
- .Property name: simple coding, but sometimes can not be used
- ['Attribute name']: coding trouble, but general
5. When must the ['attribute name'] method be used?
Question: When must the ['property name'] method be used?
- The attribute name contains special characters: -, spaces (the attribute name is not a legal identifier).
- The attribute name is uncertain.
P8 08. Shang Silicon Valley_JS Advanced_Function 15:59
P9 09. Shang Silicon Valley _JS advanced _ callback function 09:54
P10 10.Silicon Valley_JS Advanced_IIFE 14:49
P11 11. This in Silicon Valley_JS advanced_function 10:50
P12 12.Silicon Valley_JS Advanced_About sentence semicolon problem 18:38
P13 13.Silicon Valley_JS advanced_webstorm settings 23:02
P14 14.Silicon Valley_JS Advanced_Review 55:51