javascript:this

關於this

this是函數內部的一個特殊對象,this引用的是函數據以執行的環境對象,在調用函數前this的值並不肯定,不一樣的調用方式會致使this值的改變。
可結合這篇文章理解環境對象的概念

window.num = 22;
var o = {num: 11};
function sayNum(){
    alert(this.num)
}
sayNum();//22
o.sayNum = sayNum;
o.sayNum();//11

記住：函數名僅僅是一個包含指針的變量而已。所以即便是在不一樣的環境中執行，全局的sayNum()函數與o.sayNum()指向的仍然是同一個函數。

1.全局做用域中調用函數時

全局做用域中調用，this對象引用的是window
匿名函數的執行具備全局性，所以其this對象一般也指向window

function fn1(){
    console.log(this);
}

fn1();

2.經過new操做符調用

this引用的是實例對象

function Person(name){
    this.name = name;
}
Person.prototype.printName = function(){
    alert(this.name);//Byron
};

var p1 = new Person('Byron');

3.做爲對象的方法調用

this引用的是該對象

var obj1 = {
    name: 'Byron',
    fn : function(){
        console.log(this);
    }
};

obj1.fn();

4.間接調用

call和apply

每一個函數都包含兩個非繼承而來的方法：call()和apply()。這兩個方法的用途都是在特定的做用域中調用函數，實際上等於設置函數體內this對象的值。也就是說，直接調用函數，調用時指定執行環境是誰

window.color = 'red';
var o = {color: 'blue'};
function sayColor(){
    alert(this.color);
}
sayColor.call(this);//red
sayColor.call(window);//red
sayColor.call(o);//blue

1.apply方法

接收兩個參數，一個是在函數中運行函數的做用域，另外一個是參數數組。

2.call方法

call方法與apply方法相同，區別在於接收參數的方式不一樣，對於call方法而言，第一個參數是this值沒有變化，變化的是其他參數都直接傳遞給函數。

function fn(){
     console.log(this)//windwow
     function InnerFn(){
          console.log(this)
     }
     InnerFn.call(this)//window
}
fn();

function fn0(){
     console.log(this)//window
}
function fn1(){
     fn0.call(this);
     console.log(this);//window
}
fn1();

---

function fn0(){
 console.log(this)//object
}
var o = {
    fn1: function fn1(){
        fn0.call(this);
        console.log(this);//object
    }
}
o.fn1();

bind方法

這個方法會建立一個函數的實例，其this值會被綁定到傳給bind()函數的值。也就是說會返回一個新函數，而且使函數內部的this爲傳入的第一個參數

window.color = 'red';
var o = {color : 'blue'};
function sayColor(){
    alert(this.color)
}
var objectSayColor = sayColor.bind(o);
objectSayColor();//blue