Shulou(Shulou.com)06/02 Report--

This article mainly explains "what is the meaning of this". Interested friends may wish to take a look at it. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn "what is the meaning of this?"

How to make it clear that this points to? I have to say, it takes a premise to figure out this.

First of all, you need to know the basic concepts of function, object, scope and so on.

It would be nice to know the methods of call, apply and bind

Of course, it is important to learn Chinese well.

Need to know the difference between the first person and the second person and the third person

Let's start with a piece of news:

"the demon inside me has been locked up for so many years, and now the chain has been loosened."

"I'm scared, I'm lonely, I'm confused. I'm going to fight back against society, the source of my pain. I want to hurt it as much as I can and die."

This chilling passage was written by Joseph Duncan, a suspect in a series of homicides in North Dakota, on May 11, 2005. When people read the passage nearly two months later, he had brutally killed three people in a family of five and kidnapped two other children, aged 8 and 9.

Let's say you're a jc and you catch a xf.

Then you found the diary in his home. How do you feel at this time?

You must think, if the suspect wrote it himself, wouldn't it be tantamount to a confession?

Of course, the suspect can also argue that I didn't write this diary at all, it's just a joke I extracted from the Internet.

Let's try to change the diary a little and see what effect it will make.

The demon inside him has been locked up for so many years, and now the chain has been loosened. He was scared, lonely and confused. He was going to fight back against society, the source of his pain. He wanted to hurt it as much as he could, and then die.

Have you noticed?

Changed the first person to the third person.

It doesn't look like a diary at all, it's more like a novel story.

Why does a word change make such a big difference?

With this question in mind, let's begin the learning that this points to today.

The English meaning of this

First look at the English explanation this: this, this

Let's take a look at a piece of code.

Var obj = {

Show: function () {

Console.log (this)

}} obj.show ()

The result is easy to predict, printing the obj object itself

In JS, this belongs to a keyword, which can be understood as a command that comes with the system.

Usually, we interpret it as: the current object

So the question arises: who exactly is the current object?

In the above code case, this represents the object obj.

Next, let's look at another piece of code.

Function show () {

Console.log (this);} show ()

Result printing window objects

If you are surprised by this print result, then maybe you are ignoring a common sense problem.

Window objects can be omitted and not written!

So, the above code is actually equivalent to:

Function show () {

Console.log (this);} window.show ()

Let me give you another common example of event binding.

Btn.onclick = function () {

Console.log (this);} btn.onclick (); / / manually call the function / / in addition to the manual call, mouse click can also trigger function execution

In the end, whether it is called manually or by clicking a button

The printing results are all btn objects.

We seem to have summed up a rule that this points to.

This always points to the object that calls this function.

If your code structure is like this,

Object. Function ()

So, the this in the function must point to the object itself!

Assuming that this conclusion is valid, we might as well test our conjecture!

Function show () {

Console.log (this);} window.show (); / / print window object var obj1 = {}; obj1.show1 = show;obj1.show1 (); / / print obj1 object var obj2 = {}; obj2.show2 = obj1.show1;obj2.show2 (); / / print obj2 object

From the example of the code above, you can see

The window object and the obj1 object and the obj2 object share a function show

Window.show = = obj1.show1; / / truewindow.show = = obj2.show2; / / true

Three objects, using the same function.

But the printed this is different.

Window.show (); print out window objects

Obj1.show1 (); print out obj1 objects

Obj2.show2 (); print out obj2 objects

This seems to confirm once again what we just guessed:

This points to the object by which the function is called.

Science is rigorous, and we still have to verify it over and over again before we come to a conclusion.

Look at another example:

Btn.onclick = function () {

SetTimeout (function () {

Console.log (this)

}, 0)} btn.onclick ()

In fact, I just added a retarder to the original code, and the time was set to 0

Will there be any change in the printed this?

You can think about it first.

Usually intuitively, we think that the retarder only slows down the execution time, and the print result is still a btn object, unchanged.

However, after testing, it is found that the actual print result is a window object.

Was our guess wrong just now?

To explain this phenomenon, we have to look at this code again.

Btn.onclick = function () {/ /

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.