this為什么會為undefined?

Null 發布于2019-08-26 10:49 / 2187人閱讀

摘要：一前言普通定義的函數運行環境也是對象，指向運行時所在的對象。箭頭函數函數體內的對象，就是定義時所在的對象，而不是使用時所在的對象。

一、前言 普通function定義的函數

‘運行環境’也是對象，this指向運行時所在的對象。
如下：

如果一個函數在全局環境運行，this就指向頂層對象（瀏覽器中為window對象）；
如果一個函數作為某個對象的方法運行，this就指向那個對象；
如果一個函數作為構造函數，this指向它的實例對象。

箭頭函數

函數體內的this對象，就是定義時所在的對象，而不是使用時所在的對象。

本來記住這幾點已經可以了，this最終找到是可能window，但是undefined是怎么又是怎么來的，本妹子下面將一步步分析。

二、問題點:undefined是怎么來的

綜上所述，this指向運行時所在的對象或指向定義時所在的對象，但是這個對象可能最后找到是window,但都不可能是undefined，那么undefined是怎么來的呢？

三、回答

我們一般寫js文件都是babel轉成ES6的，babel會自動給js文件上加上嚴格模式。

用了嚴格模式"use strict"，嚴格模式下無法再意外創建全局變量
)，所以this不為window而為undefined

四、進階問題：嚴格模式對箭頭函數沒有效果

嚴格模式為什么對箭頭函數沒有效果，返回還是window？

五、進階問題回答

Given that?this?comes from the surrounding lexical context,?strict mode?rules with regard to?this?are ignored.

lexical means that this refers to the this value of a lexically enclosing function.

綜上所述，在箭頭函數中，this為lexical 類型,lexical意味著這個this指是所在封閉函數中this，所以嚴格模式會自動忽視use strict，所以this如下所示:

箭頭函數中，this指向運行時所在的對象，而use strict被移到函數內了，所以this為全局變量window。

Happy coding ~~ ^ ^

相關鏈接

原文地址

嚴格模式 - JavaScript

Arrow functions - JavaScript

ECMAScript 2015 Language Specification – ECMA-262 6th Edition

函數的擴展 - ECMAScript 6入門

use strict in javascript not working for fat arrow? - Stack Overflow

GPU云服務器云服務器 undefine undefined result undefined undefined reference

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106825.html

深入javascript之執行上下文

摘要：在初始化代碼時會先進入全局上下文中，每當一個函數被調用時就會為該函數創建一個執行上下文，每個函數都有自己的執行上下文。來看一段代碼這段代碼有個執行上下文全局上下文和，，屬于自己的執行上下文。聊聊js的執行上下文一，相關概念 EC : 執行上下文ECS : 執行環境棧VO ：變量對象AO ：活動對象scope chain ：作用域鏈二，執行上下文 javascript運行的代碼...

ky0ncheng 2019-08-22 15:59 評論0 收藏0
深入理解Javascript中的執行環境(Execution Context)和執行棧(Execut

摘要：引擎會執行其執行環境位于堆棧頂部的函數。當函數執行完畢時，當前執行棧會從堆棧中彈出去，并且控件將會到達其在當前堆棧下面的那個執行環境中。當完成以后，它的執行環境會會從堆棧中移出，并且控件會到達全局執行環境。如果你想成為一個Javascript開發者，那么你一定要知道Javascript程序的內部運行原理。理解執行環境和執行棧是非常重要的，其有助于理解其他Javascript的概念，比...

whidy 2019-08-23 15:23 評論0 收藏0
javascript的執行上下文

摘要：運行執行上下文正在使用的執行上下文。頂部是正在執行的上下文當執行完畢，它的執行上下文自動從棧彈出，控制流程按順序到達全局執行上下文。一旦所有代碼執行完畢，引擎從當前棧中移除全局執行上下文。在全局執行上下文中，的值指向全局對象。 https://juejin.im/post/5ba321...https://juejin.im/entry/59986...我只是搬運工，看了他們的文章后深...

yedf 2019-08-23 12:18 評論0 收藏0
[譯]了解Javascript中的執行上下文和執行堆棧

摘要：理解執行上下文和執行堆棧對于理解的其它概念如提升，范圍和閉包至關重要。正確地理解執行上下文和執行堆棧將幫助你更好地使用開發應用。引擎執行位于執行堆棧頂部的方法。當調用時，為該函數創建一個新的執行上下文，并且把它推入到當前執行堆棧。 By Sukhjinder Arora | Aug 28, 2018 原文如果你是或者你想要成為一名js開發者，那么你必須了解js程序內部的運作。理解執行...

qujian 2019-08-23 12:43 評論0 收藏0
解密JavaScript執行上下文

摘要：執行上下文棧首先我們先了解一下什么是執行上下文棧。那么隨著我們的執行上下文數量的增加，引擎又如何去管理這些執行上下文呢這時便有了執行上下文棧。這樣由多個執行上下文的變量對象構成的鏈表就叫做作用域鏈。執行上下文棧首先我們先了解一下什么是執行上下文棧（Execution context stack）。 showImg(https://segmentfault.com/img/remot...

JeOam 2019-08-26 13:51 評論0 收藏0