摘要：函數(shù)的幾種調(diào)用方式普通函數(shù)調(diào)用作為方法來調(diào)用作為構(gòu)造函數(shù)來調(diào)用使用方法來調(diào)用方法箭頭函數(shù)但是不管函數(shù)是按哪種方法來調(diào)用的，都需要記住一點誰調(diào)用這個函數(shù)或方法關(guān)鍵字就指向誰。作為構(gòu)造函數(shù)來調(diào)用構(gòu)造函數(shù)出來的實例，指向這個實例對象。

首先，了解一下this關(guān)鍵字。this關(guān)鍵字就涉及到函數(shù)調(diào)用的內(nèi)容。函數(shù)的幾種調(diào)用方式:

1 普通函數(shù)調(diào)用
2 作為方法來調(diào)用
3 作為構(gòu)造函數(shù)來調(diào)用
4 使用apply/call方法來調(diào)用
5 Function.prototype.bind方法
6 ES6箭頭函數(shù)

但是不管函數(shù)是按哪種方法來調(diào)用的，都需要記住一點：誰調(diào)用這個函數(shù)或方法,this關(guān)鍵字就指向誰。

var age = 18;
function person(){
    this.name = "Tony";
    console.log(this);      //window
    console.log(this.name); //Tony
    console.log(this.age);  //18
}
person();

代碼中定義一個普通函數(shù)person，在調(diào)用時實際上person是作為全局對象window的一個方法來進行調(diào)用的，即window.person();
因此是window對象調(diào)用了person方法，那么person函數(shù)當(dāng)中的this即指window，同時window還擁有了另外一個屬性name,值為“Tony”。

定義一個全局變量age，它相當(dāng)于是window的一個屬性。在調(diào)用person函數(shù)時它的this指向window，所以在函數(shù)內(nèi)部可以訪問到age變量，這也解釋了函數(shù)內(nèi)部可訪問全局變量。

var person = {
    name : "Tony",
    showName:function(){
        console.log(this.name);
    }
}
person.showName();

var name = "Tom";
var showname = person.showName;
showname();

定義一個對象person包含一個showName的方法，在對象person內(nèi)調(diào)用方法返回的是Tony，顯然this指向了對象person。

再定義一個全局變量name，將person.showName方法賦值給變量showname，因為在全局定義的嘛，所以showname也相當(dāng)于window的一個屬性，此時調(diào)用showname它的this是指向window的，所以返回的值就是全局變量“Tom”。

var personA = {
    name : "Tony",
    showName:function(){
        console.log(this.name);
    }
}
var personB = {
    name : "Tom",
    sayName:personA.showName
}
personB.sayName();    //Tom

personB對象中的方法調(diào)用personA中的方法，雖然showName是personA中定義的，但調(diào)用了personB，那this就指向了personB。

function Person(name){
    this.name = name;
}
var personA = new Person("Tony");
console.log(personA.name);

構(gòu)造函數(shù)new出來的實例，this指向這個實例對象。

下面就來了解一下this指向改變的三種方法。

在JavaScript中，call、apply和bind是Function對象自帶的三個方法，這三個方法的主要作用是改變函數(shù)中的this指向。所以可知它們的共同點就是都用來改變函數(shù)的this對象的指向的；還有就是三者第一個參數(shù)都是this要指向的對象，也就是想指定的上下文（函數(shù)的每次調(diào)用都會擁有一個特殊值——本次調(diào)用的上下文（context）——這就是this關(guān)鍵字的值。），然后再利用后續(xù)參數(shù)傳參。而它們的不同也就是傳參的不同，bind?是返回對應(yīng)函數(shù)，便于稍后調(diào)用；apply?、call?則是立即調(diào)用 。

它接收兩個參數(shù)，一個是函數(shù)運行的作用域（this），另一個是參數(shù)數(shù)組。

語法：

apply([thisObj [,argArray] ]);

定義：應(yīng)用某一對象的一個方法，用另一個對象替換當(dāng)前對象

說明：如果argArray不是一個有效數(shù)組或不是arguments對象，那么將導(dǎo)致一個?TypeError，如果沒有提供argArray和thisObj任何一個參數(shù)，那么Global對象將用作thisObj。

function Person(name){
    this.name = name;
    this.showName = function(){
        console.log(this.name);
    }
}
function Student(name){
    Person.apply(this,arguments);
}
var stu = new Student("Tony");
stu.showName();

它第一個參數(shù)和apply()方法的一樣，但是傳遞給函數(shù)的參數(shù)必須列舉出來。

語法：

call([thisObject[,arg1 [,arg2 [,...,argn]]]]);

定義：調(diào)用一個對象的一個方法，以另一個對象替換當(dāng)前對象。

說明：?call方法可以用來代替另一個對象調(diào)用一個方法，call方法可以將一個函數(shù)的對象上下文從初始的上下文改變?yōu)閠hisObj指定的新對象。

thisObj取值的情況：

1 不傳，或者傳null,undefined， 函數(shù)中的this指向window對象
2 傳遞另一個函數(shù)的函數(shù)名，函數(shù)中的this指向這個函數(shù)的引用
3 傳遞字符串、數(shù)值或布爾類型等基礎(chǔ)類型，函數(shù)中的this指向其對應(yīng)的包裝對象，如 String、Number、Boolean
4 傳遞一個對象，函數(shù)中的this指向這個對象

call方法的一些常見例子：

1.

function add(a,b){
    console.log(a+b);
}
function subtraction(a,b){
    console.log(a-b);
}
add.call(subtraction,3,1);    //4

定義一個加法函數(shù)、加法函數(shù)，最后的調(diào)用語句意思就是用加法替代了減法，在減法函數(shù)中通過call方法改變了this的指向，已經(jīng)不再計算a-b，而是作用加法中的a+b。

2.

function Student(){
    this.name = "Tom";
    this.showName = function(){
        console.log(this.name);
    }
}
function Teacher(){
    this.name = "Tony";
}
var stu = new Student();
var tea = new Teacher();
stu.showName.call(tea);

定義一個學(xué)生函數(shù)，它有屬性name和方法showName，而老師函數(shù)只有name屬性，最后一個調(diào)用語句的意思就是把學(xué)生的方法用到了老師函數(shù)中執(zhí)行，即便老師是沒有這個方法的。

3.

function Parent(name){
    this.name = name;
    this.showName = function(){
        console.log(this.name);
    }
}
function Son(name){
    Parent.call(this,name);
}
var baby = new Son("Tony");
baby.showName();

Parent.call(this,name)意思就是使用父母這個對象替代掉兒子函數(shù)中的this對象，那么這個兒子函數(shù)中就可以直接調(diào)用父母對象中的屬性和方法，這也就是繼承。

bind()最簡單的用法是創(chuàng)建一個函數(shù)，使這個函數(shù)不論怎么調(diào)用都有同樣的this值。

var person = {
    name : "Tony",
    showName : function(){
        console.log(this.name);
    }
}
person.showName();      //Tony

var name = "Tom";
var getName = person.showName;
getName();              //Tom

var boundGetName = getName.bind(person);
boundGetName();         //Tony