Former article: juejin. Cn/post / 694128…

Day five: ME, poor man, strike money!

Student: Good morning. Is our first step to review what we learned last time? Wow

Fang: well yes

Student: Last time we saw that you can use functions to represent tuples, you can use tuples to represent arrays (list/array)

Fang: It seems that you have taken notes, and I didn’t forget them today

Student: Are you going to learn more complex data structures today?

Fang: Well, let’s talk about “objects”. The object we often talk about is actually a “hash table”, which looks something like this:

Const me = {name: 'age', age: 18, title: 'front end'} me. Age // 18 me['age'] // 18Copy the code

Student: well

Fang: Do you have any objection to my saying that ME can be expressed as a function?

Student: Can you show me the code

Fang: Here we go.

createPerson = (name, age, title) => key => key === 'name' ? name : key === 'age' ? age : key === 'title' ? Title: null me = createPerson(' age') me('age') // 18Copy the code

Student: Well, me can really be expressed as a function… But representing me as an object makes me. Age look up faster, and your code will compare keys to different strings one by one. The more strings you have, the slower it looks up

Fang: Yes, but it’s easy to optimize, either by providing built-in object builders or by compilers, which is not what we’re talking about.

Student: I see.

Fang: So far we are reviewing the last lecture to convince you that no matter how complex a data structure is, it can be represented by a function: the real data is stored inside the function, and the function exposes a function that accesses the real data. Does that sound familiar to you?

Student: Yes! JS closures look like this.

Fang: Yes, that’s a Closure. The function returned by createPersion() (named temp), along with the free variables (name, age, title) that the function can access, is called a closure.

Student: What’s the use of closures?

The closure stores name, age, and title, and lets the temp function manipulate these variables. That’s all the closure does.

Student: What’s the use?

Fang: Isn’t that enough?

Student: How big is that? I could easily do this with objects:

Const obj = {name: 'obj ', age: 18, title:' getkey '{if(key)... return... }}Copy the code

Isn’t it?

Fang: You hit the nail on the head. Closures and objects are interchangeable: you can use objects to hold data and expose interfaces to manipulate it. You can also use closures to hold data and expose interfaces to manipulate the data.

Student: I see

Fang: JS programmers instinctively reject closures because they prefer objects. Closures are poor man’s objects. Objects are poor man’s objects Closures.

Student: How do you understand that

Square: Some languages, such as the last few versions of Java, function cannot access free variables, also cannot form a closure, so you want to “hold data, and then exposed interface to manipulate the data” can only use class and object, so “object is the closure of the poor”, meaning is to want to use the closure of the Java programmer is the poor (embarrassed), You have to choose objects as substitutes.

Student: I see

Fang: On the other hand, some languages, which do not provide real objects, can only use closures to “hold data and then expose interfaces to manipulate it”, so “closures are poor people’s objects”.

Student: What about JS?

Fang: JS supports both, but only moderately. You said JS support object oriented, its class is incomplete; You said JS support function bar, its tail recursive optimization and slow landing. It is very embarrassing, which leads to JS programmers to learn object-oriented learning is not good enough, learn functional learning is not good enough…

Student: What about me?

Fang: Just learn more programming languages.

Student: Oh… By the way, is it true that closures cause memory leaks?

Fong: Ignore that, the person who said it doesn’t understand closures or memory leaks.

Student: Oh good. What are the free variables you were talking about?

Fang: Again use code for example:

Const v1 = 'global' const f1 = (p1, p2)=>{// const v2 = 'local' to f1, const f2 = (r1, // r1, r2 are f2 parameters const v3 = 'f2 local variables' console.log(p1, p2, v2) // P1, p2, v2 are not f2 local variables, nor global variables, } f2()} f1()Copy the code

You could say, for a function,

  1. Global variables are defined in the top-level scope
  2. The variables defined in the parameter list of the function are the parameter variables of the function
  3. Variables defined in the body of a function are local variables to the function
  4. The variables other than the above three are the free variables of this function
  5. Parameter variables are sometimes considered local variables

But this concept is not clearly defined, so you can probably understand it.

Student: Can I understand it as the local variable outside the scope of the current function lexical function, is the free variable.

Fang: that’s right. Oh, and you know lexical scope

Student :(laughs) from a book

Fang: Try not to use concepts that you do not fully understand. Just use straightforward language to describe them.

Student: Ok, in the future I’ll try not to say the terms I haven’t learned yet.

Also, remember that functions are variables, so F1 is also a free variable of F2. I don’t have to tell you about it.

Student: Of course, I know that.

So that’s it for today: closures are poor objects, and objects are poor closures.

Student: I don’t think SO

Fang: Next time, next time

Student: Ok