JavaScript understands this object

This is an internal object that is automatically generated when the function is run, and can only be used inside the function, but always points to the object that called it.

Here are a few examples to deepen your understanding of this.

(1) as a function call

var name = ‘Jenny‘;function person() {    return this.name;}console.log(person());  //Jenny

The above example calls the person () in the global scope, and the calling object is window, so this point points to window and the name variable is defined in window, so this.name is equivalent to Window.name, Jenny.

Let's look at one more example:

function a() {    function b() {        function c() {            console.log(this);        }        c();    }    b();}a();    // window

In this example, the function is also called, so this is pointing to the window.

(2) method invocation as an object

var name = ‘Jenny‘;var obj = {    name: ‘Danny‘,    person: function() {        return this.name;    }};console.log(obj.person());  //Danny

In this example, the person () function is defined in the Obj object and invoked as a method of the Obj object, so this point in this direction obj,obj defines the Name property with the value of Danny, so this.name = "Danny".

(3) called as a constructor function

The difference between a constructor call and a normal function call is that the constructor creates an instance with the New keyword, and this point points to the instance object.

function person() {    return new person.prototype.init();}person.prototype = {    init: function() {        return this.name;    },    name: ‘Brain‘};console.log(person().name); //undefined

This is a more complex example, involving prototypes.

First, the constructor person is created, the prototype is redefined for the function, and two method init and name are defined on the prototype, where Init returns THIS.NAME.

Call the Name property of the person function and find that undefined is returned, why not brain?

We see, call the person, return an instance of Person.prototype.init (), assuming that the returned instance is named a, then this point is a,a as an instance of Person.prototype.init (), So all the methods defined in Person.prototype.init () can be called by a, but the Name property is defined in the person's prototype, not in the Init function, so it returns undefined.

(4) Apply and call

Use Apply () and call () to change the object that invokes the function, the first parameter is the object that called the function after the change, where the second parameter of apply () is an array, and the second parameter of the invocation is each parameter.

function person() {    return this.name;}var obj = {    name: ‘Jenny‘,    age: 18};console.log(person.apply(obj));  //Jenny

Using the Apply function changes the object calling person, which is called under the Obj object, no longer in the Window object, so this is pointing to Obj,this.name = "Jenny";

Article title: JavaScript Understanding This Object
Reprinted from Https://www.cnblogs.com/nuanriqingfeng/p/5794632.html
Tags: js,this objects

JavaScript understands this object