current position:Home>Do you believe what Lao Shi said about everything| Re learn JS
Do you believe what Lao Shi said about everything| Re learn JS
2021-08-27 05:45:00 【git-Dignity】
Preface
- Online music Poke me !
- Music Blog source code Online !
- I have been bumping in the front-end field for more than two years , Want to see Vue Source code , I don't know if there are any ape friends who want to see the source code recently , If JS Not hard enough , Suggest coming with me Relearning JS, I believe I can see the source code after learning again , You can do more with less .
- So let's see JS Of data 、 Variable 、 Memory What knowledge points can be tested .
interviewer : What is your biggest weakness ?
To be straitened for money !
You're hired !
This new skill i get here we are , Next time you can try .
Let's answer : Everything is object ?
In College , As soon as Lao Shi came up, he said to all the single dogs present : Everything is object .
I was very surprised and said : How to have objects ?
new come out .
Young and ignorant , Today is not what it used to be , So is it really right that everything is an object ?
Through the previous article Interviewer of data type (0101) We learned that , Data is divided into basic types and reference types , So do basic types also belong to objects ?
Obviously not , So I want to say Everything is data That's right !!!
First ask yourself three interview questions
var a = xxx
, a What is stored in memory ?
stay JS When a function is called and a variable parameter is passed , Value passing or reference passing ?
JS How the engine manages memory ?
If so , The interviewer is not your opponent at all .
If not , Let's first understand the data 、 Memory 、 Triangular relationships between variables .
Only know the principle behind the problem , Problem solving must be handy .
Data data , So what is data ?
Concept
Stored in memory to represent specific information ' Information ', It's essentially 0101...
characteristic
Transitivity 、 Computability .
The goal of all operations in memory is : data
- data
- Arithmetic operations
- Logical operations
- assignment
- Operation function
All the above operations will produce data .
Memory : Memory module for soul fighting ?
Whether memory and memory module can be associated ?
Concept
The space that can store data after the memory module is powered on ( temporary )
Memory life cycle
Memory space and data disappear , How did the data disappear ?
There's no space , The data naturally disappears . Because data is in space .
Like the big bang , We can still exist , Has it been undefined 了 .
There is... On a small memory 2 Type of data
- Data stored internally
- Address values
Touch your knowledge blind spot ?
No big problem , Take a picture .
Now from the stack , Create a new var a = obj
, Then I will obj Allocate more memory to a Do you ?
No, it isn't , Yes, it will obj Copy the address value of to a.
So it corresponds to the above
- Data stored internally -- The corresponding is obj
- Address values -- obj Corresponding 0X123
There are two kinds of memory
- Stack : Global variables / local variable
- Pile up : object
function fn(){
// obj It's a local variable , It's also a stack
// { name } This object is heap space
var obj = { name: ' Acridine ' }
}
Copy code
The function is on the heap , The function name is on the stack .
Balala becomes , What is a variable ?
seeing the name of a thing one thinks of its function , Variable quantity , It consists of variable name and variable value .
Each variable corresponds to a small piece of memory , The variable name is used to find the corresponding memory , Variable values are data stored in memory .
data 、 Memory 、 Variable love triangle ?
Memory the space used to store data .
Variable is the identifier of memory .
I believe you can see the data here 、 Memory 、 We have a certain understanding of the three concepts of variables .
interviewer : Make a question to warm you up ~
var obj1 = { name: ' azeri ' }
var obj2 = obj1
Excuse me, :obj2 What is preserved ,obj1 Is your address value ?
NO ~ NO ~ NO ~
obj2 What is kept is obj1 Memory content of , But this memory content happens to be the address value ;
But you can't just say : What is saved is the address value .
Copy code
interviewer : What does the following program output ?99% All people do wrong , If you don't believe it, you can cover the answer ^_^
var a = {age: 12}
var b = a
a = {name: 'BOB', age: 13}
b.age = 14
console.log(b.age, a.name, a.age)
function fn2 (obj) {
obj = {age: 15}
}
fn2(a)
console.log(a.age)
Copy code
Think of the answer , Output to the browser , The answer naturally surfaced ( See if it's right with your answer ^_^)
On the assignment of reference variables
Understand the test sites mined by the above program , In fact, it is the problem of reference variable assignment .
There are two small points , firstly :
(n)2 Two reference variables point to the same object , Modify the internal data of the object through a variable , Another variable sees the modified data
Let's translate the above words through the program .
var obj1 = {name: 'Tom'}
var obj2 = obj1
obj2.age = 12
console.log(obj1.age) // 12
function fn (obj) {
obj.name = 'A'
}
fn(obj1)
console.log(obj2.name) //A
// obj1、obj2 Two or more reference variables point to the same object ({name: 'Tom'});
// adopt obj2.age = 12 Modify object data , that obj1 Naturally, you can see the modified data .
Copy code
second :(n)2 Two reference variables point to the same object , Let one of the reference variables point to another object , Another reference variable still points to the previous object
Again , Let's translate the above words through the program .( In fact, it's the programming output problem above )
var a = {age: 12}
var b = a
a = {name: 'BOB', age: 13}
b.age = 14
console.log(b.age, a.name, a.age) // 14 Bob 13
// a、b this 2 Two reference variables point to the same object ({age: 12}),
// Give Way a Reassign {name: 'BOB', age: 13}, here b It still points to the original {age: 12}
// Now? a、b It points to two objects , because a Reassign .
function fn2 (obj) {
obj = {age: 15}
}
fn2(a)
console.log(a.age) // 13
// Should be the last output , Many people's answer is 15 Well , Why not 15 Well ?
// Because it's in fn2 Reassign values within the scope of the function , This assignment is local ,
// once fn2() Function execution finished , The function itself is released , that { age: 15 } Just go up in smoke
// So the final execution , Print a.age still 13.
Copy code
Function execution complete , The local variables in the function will be released .
reflection :fn2() And the example mentioned above fn() difference
This and the above fn() Not the same. ,fn() Is in the obj.name Not the same. , It's a point chain operation , Or change the same object .
fn() Is to modify properties , Act in the global environment ;
and fn2() Is to change the value of the reference object , Acting in a local environment .
Still ignorant , The last picture helps you to be clearer ~ If you look carefully, , You'll really understand !
Let's finish , Announce the three interview questions for the next article .
interviewer :var a = xxx, a What is stored in memory ?
-
xxx, If it's basic data , This is the data
-
xxx, If it's an object , Save the address value of the object
-
xxx, If it's a variable , The saved xxx Memory content of ( Maybe basic data , It could also be the address value )
interviewer : stay JS When a function is called and a variable parameter is passed , Value passing or reference passing ?
Come up and tell the interviewer : It could be value passing , It may also be reference passing .
The interviewer silently looked at the answer in his hand , This guy is so cute , There are options that are not in the answer .
When the interviewer tried to spray you , You said slowly :
-
understand 1: It's all worth it ( basic / Address values ) Pass on
-
understand 2: It could be value passing , It could also be reference passing ( Address values )
interviewer : How to say this? ?
Take out a portable pen from your chest , Write the reason for the answer
var a = 3
function fn(a){
a = a + 1
}
fn(a)
console.log(a) // 4
// The above is value passing
function fn2(obj){
console.log(obj.name) // ' azeri '
}
var obj = { name: ' azeri ' }
fn2(obj) // It's the content , This content happens to be the address value
// The above is reference passing
Copy code
therefore , In fact, both answers are right , See how we understand reference passing , It can be said to be the address value .
Address value is also a kind of value transfer .
interviewer :JS How the engine manages memory ?
- Memory life cycle
- Allocate small memory space , Get the right to use it
- Store the data , You can do it over and over again
- Free up small memory space
- Free memory
-
local variable : Automatically release after function execution
-
object : Become a garbage object ==> Garbage collector recycling
-
var a = 3
var obj = {}
obj = undefined
// Set the value to undefined, It doesn't release memory ,obj It's still worth it , nothing but undefined nothing more .
function fn () {
var b = {}
}
fn() // b It's automatic release , b The object pointed to is collected by the garbage collector at a later time
Copy code
Last
Finally finished two shots of vaccine ,
The stone in my heart falls as I wish ,
It seems that a great event has been accomplished this year !
Copy code
Previously recommended
Vue-Cli3 Build the component library
Vue Implement dynamic routing ( Talk to the interviewer about the highlights of the project )
VuePress Build project component documents
vue-typescript-admin-template Background management system
Link to the original text
copyright notice
author[git-Dignity],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2021/08/20210827054455345X.html
The sidebar is recommended
- Crazy blessing! Tencent boss's "million JVM learning notes", real topic of Huawei Java interview 2020-2021
- JS JavaScript how to get the subscript of a value in the array
- How to implement injection in vuex source code?
- JQuery operation select (value, setting, selected)
- One line of code teaches you how to advertise on Tanabata Valentine's Day - Animation 3D photo album (music + text) HTML + CSS + JavaScript
- An article disassembles the pyramid architecture behind the gamefi outbreak
- BEM - a front-end CSS naming methodology
- [vue3] encapsulate custom global plug-ins
- Error using swiper plug-in in Vue
- Another ruthless character fell by 40000, which was "more beautiful" than Passat and maiteng, and didn't lose BMW
guess what you like
-
Huang Lei basks in Zhang Yixing's album, and the relationship between teachers and apprentices is no less than that in the past. Netizens envy Huang Lei
-
He was cheated by Wang Xiaofei and Li Chengxuan successively. Is an Yixuan a blessed daughter and not a blessed home?
-
Zhou Shen sang the theme song of the film "summer friends and sunny days" in mainland China. Netizen: endless aftertaste
-
Pink is Wangyuan online! Back to the peak! The new hairstyle is creamy and sassy
-
Front end interview daily 3 + 1 - day 858
-
Spring Webflux tutorial: how to build reactive web applications
-
[golang] walk into go language lesson 24 TCP high-level operation
-
August 23, 2021 Daily: less than three years after its establishment, Google dissolved the health department
-
The female doctor of Southeast University is no less beautiful than the female star. She has been married four times, and her personal experience has been controversial
-
There are many potential safety hazards in Chinese restaurant. The top of the program recording shed collapses, and the artist will fall down if he is careless
Random recommended
- Anti Mafia storm: He Yun's helpless son, Sun Xing, is destined to be caught by his dry son
- Introduction to flex flexible layout in CSS -- learning notes
- CSS learning notes - Flex layout (Ruan Yifeng tutorial summary)
- Today, let's talk about the arrow function of ES6
- Some thoughts on small program development
- Talk about mobile terminal adaptation
- Unwilling to cooperate with Wang Yibo again, Zhao Liying's fans went on a collective strike and made a public apology in less than a day
- JS function scope, closure, let, const
- Zheng Shuang's 30th birthday is deserted. Chen Jia has been sending blessings for ten years. Is it really just forgetting to make friends?
- Unveil the mystery of ascension
- Asynchronous solution async await
- Analysis and expansion of Vue infinite scroll source code
- Compression webpack plugin first screen loading optimization
- Specific usage of vue3 video play plug-in
- "The story of huiyeji" -- people are always greedy, and fairies should be spotless!
- Installing Vue devtool for chrome and Firefox
- Basic usage of JS object
- 1. JavaScript variable promotion mechanism
- Two easy-to-use animation JS that make the page move
- Front end Engineering - scaffold
- Java SQL Server intelligent fixed asset management, back end + front end + mobile end
- Mediator pattern of JavaScript Design Pattern
- Array de duplication problem solution - Nan recognition problem
- New choice for app development: building mobile applications using Vue native
- New gs8 Chengdu auto show announces interior Toyota technology blessing
- Vieira officially terminated his contract and left the team. The national security club sent blessings to him
- Less than 200000 to buy a Ford RV? 2.0T gasoline / diesel power, horizontal bed / longitudinal bed layout can be selected
- How does "heart 4" come to an end? Pinhole was boycotted by the brand, Ma Dong deleted the bad comments, and no one blessed him
- We are fearless in epidemic prevention and control -- pay tribute to the front-line workers of epidemic prevention!
- Front end, netty framework tutorial
- Xiaomi 11 | miui12.5 | android11 solves the problem that the httpcanary certificate cannot be installed
- The wireless charging of SAIC Roewe rx5 plus is so easy to use!
- Upload and preview pictures with JavaScript, and summarize the most complete mybatis core configuration file
- [25] typescript
- CSS transform Complete Guide (Second Edition) flight.archives 007
- Ajax foundation - HTTP foundation of interview essential knowledge
- Cloud lesson | explain in detail how Huawei cloud exclusive load balancing charges
- Decorator pattern of JavaScript Design Pattern
- [JS] 10. Closure application (loop processing)
- Left hand IRR, right hand NPV, master the password of getting rich