JavaScript老梗之this对象

Js中的this关键词貌似是初学者必经的坑 都不例外 我们经常听到其他人说 this对象谁调用指向谁 的确这是最容易理解的 但是我们可以更加深入的去探索下 加深印象以便更加灵活的适用它

这里不得不提下Js的执行环境 它都有一个变量对象（variable object）这个变量对象是代码访问不到的 只存在后台的 保存在内存中的

执行环境顾名思义就是在运行和执行代码的之后才会存在的 例如我们运行浏览器 就相当于创建了全局环境 这个全局环境属于浏览器的 所以浏览器中全局对象是window对象

this，arguments这些内部对象只和Js的执行环境有关和它的声明环境无关 而执行环境又是在代码执行的时候创建的 所以this对象只有在执行运行的时候才确定到底指向什么对象

常用this调用的几个方式

1 作为函数调用

var name = 'zzz' ;

function myFn() {

console.log(this.name) ;

}

myFn() ;//zzz 此时this指向的是window

2作为对象的方法调用 （延续上面例子 我们添加个对象把myFn赋给对象的方法）

var name = 'zzz' ;

function myFn() {

console.log(this.name) ;

}

var obj = {name:'zwq'} ;

obj.myFn = myFn ;

obj.myFn() ;//zwq 通过（.或者[]）查找对象属性方法称“方法调用”

3 构造函数中的this(顾名思义可以构造一个对象的函数 也是函数的一种)

function Fn() {

this.name = 'zwq' ;

this.job = 'engineer'

}

var fn = new Fn() ;(没有prototype只有__proto__)

console.log(fn.name)//zwq

适用new操作符创建函数实例的时候 会发生以下几个过程 1.创建一个对象 2。将构造函数的作用域赋给新对象 3.相当于运行构造函数中代码 所以此时this指向了新对象 4.返回新对象

console.log(Fn.__proto__===Function.prototype,Function.prototype.__proto__===Object.prototype,Object.prototype.__proto__===null)//ps：原型链的结构

4 apply和call调用

Js中一切都是对象最为突出的是 函数也是对象 函数对象都拥有call和apply方法 该方法是为了动态改变this而出现的 当某一个对象不想自己写方法 就可以通过apply调用其它对象的方法或者一个函数

function sayName() {
console.log('myname is:'+this.name) ;
}
var student = {
name: 'zwq' ,
age: '20'
}
sayName.apply(student) ;// myname is:zwq 这里我们希望student对象有一个方法而自己又不想重新定义 就可以借助apply和call用其他方法来操作 这里this指向student

总结 时刻记住this的指向不是声明静止的 是动态的 总是随着函数执行的时候绑定！！！！