this 在前端是一个难点，也是一个痛点。首先this在声明的时候是不确定的，只有在被调用了之后才知道this的指向。主要有一下集中调用方式：复制代码

1: 函数名（）直接调用 此时的this指向window

```    function fn() {    	var name = '我是fn里面的name'    	console.log(this.name)    }        var name = '我是window里面的name'        fn()    window.fn()        //  结果    我是window里面的name    我是window里面的name```复制代码

2: window下默认的函数如：setTimeout this也指向window

```    setTimeout(function() {        var name = '我是setTimeout里面的name'        console.log(this.name)    }, 1000)        var name = '我是window里面的name'        //  结果    我是window里面的name```复制代码

3: Object.函数名（）的调用 此时的this指向该Object

```    var name = '我是window里面的name'    var obj = {        name: '我是obj里面的name',        getName: function() {            console.log(this.name)        }    }        obj.getName()        var temp = obj.getName    temp()        //  结果    我是obj里面的name    我是window里面的name    (声明一个全局变量temp然后将函数赋值给它，最后通过window调用)var name = '我是window里面的name'    var obj = {        name: '我是obj里面的name',        getName: function() {            console.log(this.name)        }    }        obj.getName()        var temp = obj.getName    temp()        //  结果    我是obj里面的name    我是window里面的name    (声明一个全局变量temp然后将函数赋值给它，最后通过window调用)s```复制代码

4: new运算符中的this指向该实例

```    var name = '我是window里面的name'    function Fn() {        this.name = '我是Fn函数里面的name'        this.getName = function() {            console.log(this.name)        }    }         var fn1 = new Fn()    var temp = fn1.getName        fn1.getName()    temp()        //  结果    我是Fn函数里面的name    我是window里面的name    (声明一个全局变量temp然后将函数赋值给它，最后通过window调用)```复制代码

5: 数组元素为函数时，通过数组来调用函数，此时的this为该数组

```    function yideng(a, b, c) {        console.log(this.length)        console.log(this.callee.length)    }    function fn(d) {    	arguments[0](10, 20, 30, 40, 50)    }    fn(yideng, 10, 20, 30)        // 结果    4    1   （callee是arguments对象的一个属性，指向当前执行的那个函数）```复制代码

6: bind,call,apply 对 this 的重新绑定，this都指向第一个参数

```    function fn() {    	var name = '我是fn里面的name'    	console.log(this.name)    }        var name = '我是window里面的name'        fn()    fn.bind({name: '我是bind里面的name哦'})()   // 注意bind之后返回的是一个函数哦    fn.call({name: '我是call里面的name哦'})    fn.apply({name: '我是apply里面的name哦'})        // 结果    我是window里面的name    我是bind里面的name哦    我是call里面的name哦    我是apply里面的name哦```复制代码

7: 箭头函数中this指向最近一层中的this，不决定于谁调用

```    function fn() {    	var name = '我是fn里面的name'    	console.log(this.name)		function fn2() {			console.log(this.name)		}				fn2()    }        fn.call({name: '我是call里面的name哦'})        //  结果    我是call里面的name哦    我是window里面的name        function fn() {    	var name = '我是fn里面的name'    	console.log(this.name)		var fn2 = () => {			console.log(this.name)		}				fn2()    }        fn.call({name: '我是call里面的name哦'})        //  结果    我是call里面的name哦    我是call里面的name哦```复制代码