JS the This point

Source: Internet
Author: User

Rule 1: Use new after this to point to the object created by new

function __new () {    this" test "    console.log (this  )}varnew __new ()

This is the object created by the new construct, which points to it

Rule 2: Use call or apply this to point to the object you passed in this object cannot be null, undefined, or point to window

function aa () {    Console.log (this)    console.log (this. A)}  var b = {    ' I am a B object '}aa.call (b)
Aa.apply (b)

Rule 3:this points to the last called position of the function

function A (x) {    Console.log (this)    console.log (this = = = x)}  var b = {    C:A}B.C (b)  //Can be understood as a called execution in B, the execution position is B,this point B

var c = {    dd: {        a:function (x) {            Console.log (this = = =  x)        }    }} C.DD.A (c) c.dd.a (C.DD)//This is where the real execution is.

Default: This points to the Global (window) object in strict mode to point to undefined

function aa () {   function bb () {       Console.log (this)       console.log (this = = window)   }   bb ()}AA ()
/* Same as below */
//function aa () {//bb ()// }//function bb () {//Console.log (this)//Console.log (this = = window)// }//AA ()

Take a rule Usage chart:

Take a look at this example:

function foo () {    Console.log (this)    console.log (this = =  window)}  var bar = {    aa:foo}foo () bar.aa ()var zz = bar.aazz ()

It is easy to set the first result and the second result with a rule. Here is the analysis of ZZ (), why does pointing to the window?this binding be lost? Is the rule wrong?

Let's take a look at these two examples.

Example 1:

var aa = 1var BB = aabb + = 1console.log (aa) Console.log (BB)

Example 2:

var a = {    1}var c =2Console.log (c) Console.log (A.B)

Turns out a.b turned 2, unexpectedly.

The first way to assign a value to BB is to copy the AA to the BB so that the BB operation will not have any effect on AA

The second is to assign a reference to the object "a" to {b:1} to C. At this point, both A and C are pointing to {b:1}.

These two situations occur because of the mechanism of the JS pair assignment, the assignment/delivery method is determined by the "right of equal sign"

For objects (including arrays and encapsulated objects) and functions, the values/passes are always assigned by reference replication.

Symbol in other null, undefined, string, number, Boolean, and ES6 are copied/passed by value

So the above get Bar.aa is a function. So here's the reference assignment/pass-through

ZZ equals direct pointing to the

That is, var zz = foo So here's the default rule. This points to the Window object

It is worth noting here that the arrow function in ES6 is the arrow function without this is that it puts the arrow function outside the (or the position of the arrow function) this to "catch" come in

varc ={dd: {a: (x)={Console.log ( This===x)}, B: This}}c.dd.a (c) c.dd.a (c.dd.b) c.dd.a (C.DD) Console.log ("--------------") function aa () { This. A =1    varb = ThisConsole.log (b); (() ={Console.log ( This===b)}) ()}varQaq =NewAA ()

------------------------------------------------If there is any misunderstanding, please correct me. qaq~

JS the This point

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.