Do you believe what Lao Shi said about everything| Re learn JS

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 ）

What you don't know about the project Axios Operation （ The core principle of handwriting 、 Compatibility ）

VuePress Build project component documents

koa2+vue+nginx Deploy

vue-typescript-admin-template Background management system

Link to the original text

juejin.cn/post/699945…