this points to a function js

this

• In the interview, js point often asked question in the development process is also a need to pay attention, this in strict mode point undefined, not discussed here.

Ordinary function

• Remember the word which object to call a function, this points to the function of the object. The total points to its caller.

  obj.getName () undoubtedly will print out 'Huang Jie', b () can be written window.b (), called object is window, name and therefore access to global variables.

var name = '车神'
var obj = {
    name: '黄杰',
    getName: function(){
        console.log(this.name)
    }
}

var b = obj.getName

obj.getName()// '黄杰'
b() // '车神'

• However, the following code might a bit puzzled, why print is undefined, because the use of global variables var declaration will become property of the window, and variables let, const declared ES6 is no longer a window property, through window. name can not access the property.

let name = '车神'
let obj = {
    name: '黄杰',
    getName: function(){
        console.log(this.name)
    }
}

let b = obj.getName

b() // undefined

Arrow function

• Arrow definition function when this point is determined, context is the object within the definition of this point, the global context object window.

  Some people think it should not be two are 'Huang Jie do'? Js execution in the global context, function, Eval execution context, the execution context is not an object, so it would have been up for the most recent execution context. It is the window.

var name = '车神'
var obj = {
    name: '黄杰',
    getName: () =>{
        console.log(this.name)
    }
}

var b = obj.getName

obj.getName()// '车神'
b() // '车神'

new operator

• See from this article js depth analysis of new operators , new operators to do a few things. this points to an empty object that the process creates.

  1. Create an empty simple JavaScript object (i.e. {});
  2, link to the object (i.e., the object constructor set) to another object;
  3, the newly created object as Step 1 of this context;
  4, If the function does not return the object, this is returned.

A face questions

• This is what I currently see the most interesting face questions, first thought two minutes ...

var length = 100

function foo(){
    console.log(this.length)
}

var obj = {
    length: 10,
    getLength(cb){
        cb()// 打印啥？
        arguments[0]()// 打印啥？
    }
}

obj.getLength(foo, length, obj)

1. The answer is 100, 3.
2.CB () call is the object window, arguments [0] () arguments to call the object, it is a pseudo-array is an object, length length parameter passed to the function call, thus print 3.

Two face questions

• This question is a bit mean, but also wrong, first thought two minutes

function foo(xx){
    this.x = xx
    return this
}

var x = foo(5)

var y = foo(6)

console.log(x.x)// 打印啥？
console.log(y.x)// 打印啥？

1. The answer is undefined, 6, two calls to this point window.
2. When performing foo (5), to give window.x = window, window.xx = 5.
3. When performing foo (6), this.x = 6 corresponds window.x = 6, no longer window.x = window, and there is no case window.x x property, so xx accessed by nonexistent property It is undefined.