淺談javascript中的this
js的this是什麼?關於這個東西,博客園裡面有太多的解釋了,不過,本人看了一下,感覺對this解釋的有點複雜了,因此,本人在此給this一個簡單易於理解的定義。
this其實是js的一個物件,至於是什麼物件呢?很簡單,this這個物件就是:誰呼叫它它就指向誰。
關於這一點,其實,博客園的文章已經說明了很多了,有的文章也說到了點子上,只不過,他們解釋的還是有點模糊,這裡,我給大家做幾個簡單的對照實驗,根據這幾個對照實驗的結果,大家應該很清楚了。
希望大家根據我的程式碼重複實現下面的實驗。
首先,我們來看下面的程式碼:
//创建一个局部对象a var a = { user:'小东', getName:function(){ return this.user;//返回当前对象的user属性值 } } //调用a的getName方法 alert(a.getName());
#上面的程式碼會輸出什麼呢?沒錯,這裡alert的是・・・・小東・・・・,很簡單,這裡是在a對象的內部調用this嘛,肯定是a對象調用this,所以根據・・・・・・・・・・・・・誰調用this它就指向誰這個定義・・・・・・・・・・・,那麼這裡的this指向的就是a對象。
接下來,我們再給上面的程式碼新增一行:
//创建一个局部对象a var a = { user:'小东', getName:function(){ return this.user;//返回当前对象的user属性值 } } //调用a的getName方法 alert(a.getName()); //把局部对象的属性函数赋值给外面的变量out var out = a.getName; //调用out函数 alert(out());
根據上面的實驗結果,我們知道直接呼叫a.getName輸出的是小東,對吧?那麼,我們把a.getName這個屬性函數賦值給out變數之後,再來呼叫out會輸出什麼呢?結果是:undefined的。為什麼會是undefined的?請思考一會兒。要是你明白這裡為什麼輸出的是undefined的原因,那麼,我想你對this的理解已經很清楚了。但是,如果,你對本文有興趣,你還是可以繼續看下去的。
這裡,我先不解釋為什麼在外面引用a物件的getName函數卻得不到a物件裡面的值,我們轉過彎來講,請看下面的程式碼(其實和上面的程式碼是差不多的,呵呵):
//创建一个局部对象a var a = { user:'小东', getName:function(){ return 1;//这里我们不返回this,而是返回1 } } //调用a的getName方法 alert(a.getName()); //把局部对象的属性函数赋值给外面的变量out var out = a.getName; //调用out函数 alert(out());
上面的程式碼很簡單吧,這裡,我們不在a物件的getName屬性函數裡面傳回a物件的東西,而是返回・・・1・・・・・,那麼,此刻你再呼叫out函數,你覺得會輸出什麼呢?沒錯,你得到的不再是・・・・undefined・・・・的,而是一個實實在在的數字・・・・1・・・・・・。這就奇怪了,對吧?當a.getName函數傳回的是a物件裡面的user屬性時,我們用out來引用a.getName函數時,我們得到的是undefined的結果,而當a.getName函數傳回的是1時,我們再用out引用a.getName函數卻可以得到a.getName裡面的東西?這是怎麼回事呢?
原因很簡單,當我們呼叫外面的全域變數out的時候,this它指向的應該out的對象,而不是a對象,而out的對像是誰呢?我們應該知道,js在全域中宣告的變數的物件是window物件吧。 既然呼叫out時,this指向的是window,那麼函數out=a.getName=function(){return this.user;}裡面的this.user我們應該寫出window.user對吧? 但是,此刻,全域變數中有沒有一個window.user的屬性值呢?沒有吧?既然沒有window.user這個屬性值,那我們alert(window.user)一定是undefined啦。為了證明這一點,我們來做下面的實驗:
//创建一个局部对象a var a = { user:'小东', getName:function(){ return this.user;//返回当前对象的user属性值 } } //调用a的getName方法 alert(a.getName()); //把局部对象的属性函数赋值给外面的变量out var out = a.getName; //我们增加一个window.user的全局属性,看看再次调用out函数会输出什么 var window.user='window"s username'; //调用out函数 alert(out());
#此刻,當你再執行上面的程式碼時,你會發現,out函數輸出的不再是undefined,而是window's username,證明了什麼?證明了當out調用this時,this確實指向了window,同時也證明了,this確實是:誰調用它它就指向誰。
如果你不懂js的全域變量,那麼,我們可以把上面的程式碼換成下面的程式碼再來呼叫out,你就更明白了:
##
//创建一个局部对象a var a = { user:'小东', getName:function(){ return this.user;//返回当前对象的user属性值 } } //调用a的getName方法 alert(a.getName()); //把局部对象的属性函数赋值给外面的变量out var out = a.getName; //此刻,我们增加一个user的变量,看看再次调用out函数会输出什么 var user='window"s username'; //调用out函数 alert(out());
這裡,我們不再啟用window這個對象,對於外面的屬性和函數,我們一律都用var 來聲明,既然都用var來聲明,那麼他們應該都指向同一個對象吧?此刻,你再執行上面的程式碼,也就是執行out函數,還是可以alert出window's username。行文到此,this的定義已經再明白不過了,它就是:誰調用它它就指向誰。
this不難理解,難以理解的是,你要找到那個調用它的・・・・・・・・對象・・・・・,只有找到調用this的對象,你才知道this到底指向誰,因為:this的定義就是:誰呼叫它它就指向誰。
#
以上是淺談javascript中的this的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

AI Hentai Generator
免費產生 AI 無盡。

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

熱門話題

如何使用WebSocket和JavaScript實現線上語音辨識系統引言:隨著科技的不斷發展,語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統,具備了低延遲、即時性和跨平台的特點,成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

如何利用JavaScript和WebSocket實現即時線上點餐系統介紹:隨著網路的普及和技術的進步,越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統,我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議,可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中,當使用者選擇菜餚並下訂單

如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代,越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統,並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工

JavaScript和WebSocket:打造高效的即時天氣預報系統引言:如今,天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展,我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中,我們將學習如何使用JavaScript和WebSocket技術,來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

JavaScript是一種廣泛應用於Web開發的程式語言,而WebSocket則是一種用於即時通訊的網路協定。結合二者的強大功能,我們可以打造一個高效率的即時影像處理系統。本文將介紹如何利用JavaScript和WebSocket來實作這個系統,並提供具體的程式碼範例。首先,我們需要明確指出即時影像處理系統的需求和目標。假設我們有一個攝影機設備,可以擷取即時的影像數

Golang是一門功能強大且高效的程式語言,可用於開發各種應用程式和服務。在Golang中,指標是一種非常重要的概念,它可以幫助我們更靈活和有效率地操作資料。指標轉換是指在不同類型之間進行指標操作的過程,本文將透過具體的實例來學習Golang中指標轉換的最佳實踐。 1.基本概念在Golang中,每個變數都有一個位址,位址就是變數在記憶體中的位置。
