JavaScript中的this

1：基本概念

this字面意思是当前，当前执行代码的环境对象或者是上下文。表明着当前方法执行的环境上下文，那么何为环境上下文，通俗的说，谁调用了函数，谁就是这个函数的环境上下文。

在js中，this只有两种指向，一种是指向当前的封闭做用域，或者是指向当前做用域的外层，this的最顶层就是window对象。

关于this必需要了解的是严格模式，严格模式是js里面的一个子集，是具备限制性JavaScript变体，严格模式也是js的一种，可是加了一些限制。

好比：

• 在严格模式下经过抛出错误来消除了一些原有的静默错误(静默错误：语法有错误可是js并无提示，默认容许这个操做)。好比要取一个函数的传入参数，在非严格模式下，能够直接拿到它的grument，但在严格模式下会抛出一个错误。
• 严格模式修复了一些致使JavaScript引擎难以执行优化的缺陷
• 禁用了在ECMAScript的将来版本中可能会定义的一些语法

进入"严格模式"的标志："use strict";

// 为整个脚本开启严格模式 
    "use strict";
    var v = "Hi!  I'm a strict mode script!";
    
    // 为函数开启严格模式 
    function strict() {
        'use strict';
        function nested() { 
            return "And so am I!"; 
        }
        return "Hi!  I'm a strict mode function!  " + nested();
    }

2：全局环境

在全局环境下，不管是否在严格模式下，在全局执行环境下(任何函数体外部)this指向全局对象。也就是说在全局执行环境，这个this永远指向全局对象，这个全局对象在浏览器中就是window。

//浏览器环境
    var name = 'Eric';
    console.log(window.name === this.name);  /* true */
    console.log(window === this);            /* true */

3：函数体内部

在函数体内部，this的值取决于函数被调用的方式。函数被调用的方式有不少种：

简单调用，也就是说没有添加任何额外的操做，没有添加一个this的绑定或者是改变。

简单调用分为严格模式与非严格模式。

• 在非严格模式下，this默认指向全局对象。

  // 浏览器环境
    function simple(){
        return this;
    }
    console.log(simple() === window);
    // true

• 在严格模式下，保持进入执行环境时的值，没有指定时默认undefined。

  // 浏览器环境
     function simple2(){
         "use strict";
         return this;
     }
     simple2() === undefined;
     // true 
     window.simple2() === window;
     // true

this传递，在js中this绑定有两种：

• 一种是call/apply，能够看做是一种，它们都是一个绑定this的当即执行的一个方法，绑定以后会当即执行这个函数，二者的区别在于传递参数的不一样，一个是传一个参数，一个是传一堆参数；call/apply其实是绑定值的是一个对象，存在一个ToObject过程。call/apply是一个当即执行的绑定this的一个操做。

  // 浏览器环境 
     var object = {
         name: 'Eric'
     };
     var name = 'Iven';
     function getName(arg) {
         return this.name;
     }
  
     getName(); /* Iven */
     getName.call(object); /* Eric */
     getName.apply(object); /* Eric */

• 另外一种是bind，与上面不一样的是bind不会当即执行，它只是实现一个绑定的过程，返回的是一个柯里化的函数，这个柯里化的函数就是call/apply。bind只能被绑定一次。

  name = 'Davy';
     function bindThis(){
         return this.name;
     }
     var getName1 = bindThis.bind({ name: "Eric" });
     console.log(getName1()); /* Eric */
  
     var getName2 = getName1.bind({ name: "Iven" });
     console.log(getName2()); /* Eric */

箭头函数在执行的时候会造成一个封闭的做用域，this与封闭做用域的this保持一致，call/apply/bind都将会被忽略。

// 浏览器环境 
 var globalThis = this;
 var arrowsFunction = () => this;
 console.log(arrowsFunction() === globalObject); /* true */

做为对象的方法被调用(有一个靠近原则)：在对象里面定义了一个函数，而后经过对象去调用这个函数。

// 浏览器环境 
 var object = {
     name: 'Eric',
 
     getName: function() {
         return this.name;
     }
 };
 console.log(object.getName()); /* Eric */
 
 
 function getName2() {
     return this.name;
 }
 object.getName = getName2;
 console.log(object.getName()); /* Eric */
 
 
 object.object = {
     getName: getName2,
     name: 'Iven'
 };
 console.log(object.object.getName()); /* Iven */

4：全局函数

• setTimeout
• setInterval
• alert

setInterval()方法用于在指定的毫秒数后调用函数或计算表达式。

语法：setTimeout(code，millisec)，参数code必需，要调用的函数后执行的JavaScript代码串；millisec必需，在执行代码前等待的毫秒数。

注意：setTimeout()只执行code一次，若是须要屡次调用，请使用setInterval()或者让code自身再次调用setTimeout()，也就是利用递归。

setInterval()方法可按照指定的周期来调用函数或计算表达式。它会不停地调用函数，指导clearInterval()被调用或者窗口被关闭。由setInterval()返回的ID值能够用做clearInterval()方法的参数。

语法：setInterval(code，millisec[,"lang"])