The point of this in JS

Source: Internet
Author: User

JS in this direction:This is very important in object-oriented programming, its value depends on the mode of invocation. In JS, there are four modes of invocation, method invocation pattern, function call pattern, constructor invocation mode, and apply invocation mode.

Method invocation Pattern: When a function is saved as a property of an object, we call it a method. When the method is called, this is bound to the object. Method can use this to access an object, so it can take value from the object or modify the object. This binding to the object occurs at the time of the call. The method that is preferable to the context of the object to which they belong is called a public method.

var myobj = {    1,    function  () {        returnthis  . Value    // Output 1

Function call Pattern: When a function is not a property of an object, it is called as a function. When a function is called, this is bound to the global object. This is a mistake in language design, and if the statement is designed correctly, when an intrinsic function is called, this should still be bound to the this variable of the external function. Fortunately, there is an easy solution, if the method defines a variable and assigns it a value of this, then the intrinsic function can be accessed through the variable to this.

varmyobj = {Value:1}varValue = 10; myobj.Double=function (){    varthat = This; varThis01 = (function (){        returnThat.value;        })(); varTHIS02 = (function (){        return  This. Value;    })();  Console.log (THIS01); //this01 Output 1Console.log (THIS02);//THIS02 output Ten}myobj.Double()

constructor invocation Pattern: If you call with a new in front of a function, you will create an object that is hidden from the prototype member of the function, and this will be bound to the new object. The new prefix also alters the behavior of the return statement.

//Create a constructor function named QuovarQuo =function(string) { This. Status =string}//provides a common method named GetStatus for all instances of quoQuo.prototype.getStatus =function (){    return  This. Status}//constructs a quo instancevarMyquo =NewQuo (' csh '); Myquo.getstatus (); //Output CSH

Functions called with the new prefix are called constructor functions, which, by convention, are stored in a variable named in uppercase format. Very bad things can happen if you call the constructor without adding new in front of it. Therefore, the capitalization Convention is very important (the constructor function is not recommended).

Apply Call Mode: in JS the function is to have the method. The Apply method lets us construct a parameter array and use it to invoke the function. It also allows us to select the value of this. The Apply method receives two parameters. The first is the value that will be bound to this, and the second is an array of arguments. This defaults to calling the global object when the first argument to apply is null.

varAdd =function(A, b) {returnA +b;}vararr = [3, 4];console.log (add.apply (NULL, arr));//Output 7varMyOBJ = {name: ' CSH '};varMyName =function (){    return  This. Name; Console.log (Myname.apply (MyOBJ,NULL));//Output CSH

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.