【JavaScript】this指的是誰？

ytwman 發布于2019-08-19 17:49 / 394人閱讀

摘要：引用的是函數功能據以執行的環境對象，因此的值與調用函數的方式有著密切的關系。調用構造函數在調用構造函數時返回，指向構造函數創建的實例中，指向實例對象。則函數內部的指向方法指定的對象。若閉包在全局作用域中調用，則指向。

在函數創建的時候，函數內部自動獲取到this（還有一個arguments）。this引用的是函數功能據以執行的環境對象，因此this的值與調用函數的方式有著密切的關系。

作為函數調用時，this指向window。

   var name = "window";
   function sayName() {
       console.log(this.name);
   }
   sayName(); //window

作為對象的方法調用時，this指向該對象。

   var obj = {
       name: "object",
       sayName: function() {
           console.log(this.name);
       }
   };
   obj.sayName(); //object
   (obj.sayName = obj.sayName)(); //window
   (obj.sayName, obj.sayName)(); //window

賦值語句和逗號運算符都會返回后面變量的值，所以后兩者相當于在全局中調用了函數，this指向了window。

調用構造函數
在調用構造函數時返回this，this指向構造函數；創建的實例中，this指向實例對象。

   function Person(n) {
       console.log(this);
       this.name = n;
       this.sayName = function() {
           return this.name;
       };
   }
   var person = new Person("hiyohoo"); //Person{}
   console.log(person.sayName()); //hiyohoo

調用函數時指定this。在調用函數時如果使用函數方法call()、apply()、bind()。則函數內部的this指向方法指定的對象。而一旦被bind()指定了this值，之后不管以何種方式調用函數，其this值始終指向bind()指定的對象環境。

   var outer = {
       name: "outer",
       inner: {
           name: "inner",
           t: function() {
               return this.name;
           }
       }
   };
   console.log(outer.inner.t()); //inner
   console.log(outer.inner.t.bind(outer)()); //outer

閉包中的this。若閉包在全局作用域中調用，則this指向window。這里我們用定時器做例子：

   var name = "window";
   var obj = {
       name: "object",
       sayName: function() {
           setInterval(function() {
               console.log(this.name);
           }, 1000);
       }
   };
   obj.sayName(); //window

作為dom綁定事件的回調函數。this指向這個dom元素。

轉載請注明出處：https://segmentfault.com/a/1190000004587440

文章不定期更新完善，如果能對你有一點點啟發，我將不勝榮幸。

云服務器 GPU云服務器指的是 html指的是 php指的是 json指的是

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

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

JavaScript的創世神話——一切源于對象

摘要：但是，中并沒有類的概念，而是通過構造函數替代了類的功能，為某一類的對象提供共同的屬性和方法。一只名叫的狗，首先繼承了構造函數的原型對象，而的原型對象中的有繼承了函數的原型對象，函數對象中的有繼承了的原型對象。《圣經》里的第一章創世紀中其中有一段經典記載上帝是如何創造人的。神說：我們要照著我們的形象，按照我們的樣式造人。不謀而合的是，JavaScript中似乎也遵循著上帝的旨意去創造程...

enda 2019-08-22 10:50 評論0 收藏0
前端面試基本知識點——javascript

摘要：又到一年春招季，們又要奔波于一場又一場的面試。今天就先來小小總結一下方面的知識點，方便你我他。在發送請求前加上。在后面加上時間搓。這樣頁面的所有都會執行這條語句就是不需要保存緩存記錄。如何解決跨域問題服務器上設置代理頁面又到一年春招季，coder們又要奔波于一場又一場的面試。今天就先來小小總結一下javascript方面的知識點，方便你我他。隨時補充 js基本數據類型 Undef...

hankkin 2019-08-20 14:47 評論0 收藏0
JS基礎入門篇（四）—this的使用，模擬單選框，選項卡和復選框

摘要：建立索引，記錄每一個節點值。選項卡模擬選項卡方法一大清洗，在設置顏色之前把所有的顏色值設為空。宋體選項卡一選項卡二選項卡三內容一內容二內容三方法二點擊什么，清除什么。 1.this的使用 this js中的關鍵字 js內部已經定義好了,可以不聲明直接使用 this的指向問題 1. 在函數外部使用 this指向的是window 2...

tanglijun 2019-08-22 17:14 評論0 收藏0
JS基礎入門篇（四）—this的使用，模擬單選框，選項卡和復選框

摘要：建立索引，記錄每一個節點值。選項卡模擬選項卡方法一大清洗，在設置顏色之前把所有的顏色值設為空。宋體選項卡一選項卡二選項卡三內容一內容二內容三方法二點擊什么，清除什么。 1.this的使用 this js中的關鍵字 js內部已經定義好了,可以不聲明直接使用 this的指向問題 1. 在函數外部使用 this指向的是window 2...

hot_pot_Leo 2019-08-29 15:23 評論0 收藏0
JS基礎入門篇（四）—this的使用，模擬單選框，選項卡和復選框

摘要：建立索引，記錄每一個節點值。選項卡模擬選項卡方法一大清洗，在設置顏色之前把所有的顏色值設為空。宋體選項卡一選項卡二選項卡三內容一內容二內容三方法二點擊什么，清除什么。 1.this的使用 this js中的關鍵字 js內部已經定義好了,可以不聲明直接使用 this的指向問題 1. 在函數外部使用 this指向的是window 2...

CoderDock 2019-08-02 10:26 評論0 收藏0