js中this的作用

this 是 JavaScript 中的关键字，在常见的面向对象语言中都有 this 的身影，相较下 JavaScript 中的 this 比较特殊，特殊在它会在执行期间动态改变指向。this 一般定义在函数中，如果按英文解释，很容易产生误解，this 既不指向函数自身，也不指向函数的词法作用域。它在运行时进行绑定，它指向什么完全取决于函数在哪里被调用。

调用函数时，将创建一个执行环境，this 在运行时根据函数的执行环境绑定。它允许函数在内部引用上下文中的执行变量，使函数编程更加优雅和简洁。

作用

1、默认绑定

默认绑定规则下，函数的运行环境为全局环境，this默认指向Window。

2、作为单纯的函数调用:

 function fooCoder(x) {  
    this.x = x;  
  }  
  fooCoder(2);  
  alert(x);// 全局变量x值为2 

在普通函数中的this，指向了全局函数，即window ，在严格模式下，是undefined

3、作为对象的方法调用：

var name = "clever coder";  
var person = {  
    name : "foocoder",  
    hello : function(sth){  
        console.log(this.name + " says " + sth);  
    }  
}  
person.hello("hello world"); 

输出 foocoder says hello world。this指向person对象，即当前对象。

4、作为构造函数：

new FooCoder(); 

函数内部的this指向新创建的对象

5、内部函数

var name = "clever coder";  
var person = {  
    name : "foocoder",  
    hello : function(sth){  
        var sayhello = function(sth) {  
            console.log(this.name + " says " + sth);  
        };  
        sayhello(sth);  
    }  
}  
person.hello("hello world");//clever coder says hello world  

在内部函数中，this没有按预想的绑定到外层函数对象上，而是绑定到了全局对象。这里普遍被认为是JavaScript语言的设计错误，因为没有人想让内部函数中的this指向全局对象。一般的处理方式是将this作为变量保存下来，一般约定为that或者self：

var name = "clever coder";  
var person = {  
    name : "foocoder",  
    hello : function(sth){  
        var that = this;  
        var sayhello = function(sth) {  
            console.log(that.name + " says " + sth);  
        };  
        sayhello(sth);  
    }  
}  
person.hello("hello world");//foocoder says hello world 

6、使用apply和call设置this

person.hello.call(person, "world")

apply和call类似，只是后面的参数是通过一个数组传入，而不是分开传入。两者的方法定义：

call( thisArg [，arg1，arg2，… ] );  // 参数列表，arg1，arg2，...  
apply(thisArg [，argArray] );     // 参数数组，argArray 

两者都是将某个函数绑定到某个具体对象上使用，自然此时的this会被显式的设置为第一个参数。

7、“new”绑定

new绑定是我们常用的方法。事实上，我们可以创建一个构造，然后新建一个实例对象。这时候this指向了new出来的实例对象。

当我们彼此认识时，我们主要做以下事情：

• a、创建一个新对象
• b、让这一点指向新对象并执行构造体
• c、将新对象的 proto 属性设置为指向构造的原型对象
• d、判断构造的返回类型。如果是，则返回新对象。如果它是引用类型，它将返回此类型的对象。

首先，创建了“Person”的构造，然后，通过“new”创建了一个“zhangsan”的实例对象。在“zhangsan”的“foo”函数中，“this”指向“zhangsan”的实例。

function Person(name, age) {
  this.name = name
  this.age = age
  this.foo = function () {
    console.log(this.name);
  }
}

const zhangsan = new Person('zhangsan', 18)
console.log(zhangsan) // {name: 'zhangsan', age: 18, foo: ƒ}
zhangsan.foo() // zhangsan

在严格模式下，“this”指向一个问题。