為了保證的可讀性，本文采用意譯而非直譯。

想閱讀更多優質文章請猛戳GitHub博客,一年百來篇優質文章等著你！

1. this 的奧秘

很多時候, JS 中的 this 對于咱們的初學者很容易產生困惑不解。 this 的功能很強大，但需要一定付出才能慢慢理解它。

對Java、PHP或其他標準語言來看，this 表示類方法中當前對象的實例。大多數情況下，this 不能在方法之外使用，這樣就比較不會造成混淆。

在J要中情況就有所不同: this表示函數的當前執行上下文，JS 中函數調用主要有以下幾種方式：

每種調用類型以自己的方式定義上下文，所以就很容易產生混淆。

此外，嚴格模式也會影響執行上下文。

理解this關鍵是要清楚的知道函數調用及其如何影響上下文。

本文主要說明函數的調用方式及如何影響 this，并且說明執行上下文的常見陷阱。

在開始之前，先知道幾個術語：

調用函數正在執行創建函數體的代碼，或者只是調用函數。 例如，parseInt函數調用是parseInt（'15'）。

2.函數調用

當一個表達式為函數接著一個(，一些用逗號分隔的參數以及一個）時，函數調用被執行，例如parseInt('18')。

函數調用表達式不能是屬性方式的調用，如 obj.myFunc()，這種是創建一個方法調用。再如 [1,5].join(',')不是函數調用，而是方法調用，這種區別需要記住哈，很重要滴。

函數調用的一個簡單示例：

function hello(name) { return 'Hello ' + name + '!';}// 函數調用const message = hello('World');console.log(message); // => 'Hello World!'

hello('World')是函數調用: hello表達式等價于一個函數，跟在它后面的是一對括號以及'World'參數。

一個更高級的例子是IIFE(立即調用的函數表達式)

const message = (function(name) {  return 'Hello ' + name + '!';})('World');console.log(message) // => 'Hello World!'

IIFE也是一個函數調用:第一對圓括號(function(name) {...})