首頁 web前端 js教程 js中this的指向問題探討

js中this的指向問題探討

Mar 16, 2018 pm 05:09 PM
javascript this 探討

本文主要和大家分享js中this的指向問題探討,this關鍵字代表目前正在執行的方法的對象,如果沒有當前方法,則是指全域變數。就是說this代表呼叫該方法的物件的參考。

一、全域作用域或在普通函數中this指向全域物件window。

//直接打印
    console.log(this) //window
//function声明函数
    function bar () {conso
le.log(this)}bar() //window
//function声明函数赋给变量
    var bar = function () {console.log(this)}bar() //window
//自执行函数
    (function () {console.log(this)})(); //window
登入後複製

#二、方法呼叫中誰呼叫this指向誰

//对象方法调用
    var person = {run: function () {console.log(this)}}person.run()// person
//事件绑定
    var btn = document.querySelector("button")btn.onclick = function () {console.log(this) // btn}
//事件监听
    var btn = document.querySelector("button")btn.addEventListener('click', function () {console.log(this) //btn})
//jquery的ajax
    $.ajax({ self: this,    type:"get",    url: url,    async:true,    success: function (res) {console.log(this)
 // this指向传入$.ajxa()中的对象
    console.log(self) // window  } }); 
//这里说明以下,将代码简写为$.ajax(obj) ,this指向obj,在obj中this指向window,因为在在success方法中,独享obj调用自己,所以this指向obj
登入後複製

#三、#在建構函式或建構子原型物件中this指向建構子的實例

//不使用new指向window
    windowfunction Person (name) {console.log(this) // window    
    this.name = name;}Person('inwe')
//使用new
    function Person (name) {this.name = name   console.log(this) //people     
    self = this  }  var people = new Person('iwen')  console.log(self === people) //true
//这里new改变了this指向,将this由window指向Person的实例对象people
new改变this指向,将this指向window改为指向person的实例people
登入後複製

改變this的指向:

    函數本身就是一個特殊類型,大多數認為是一個變量,this指向誰在函數定義時候確定不了,只有在函數執行時候才可以確定this到底指向誰,實際上this指向的是最終調用他的函數。

相關推薦:

PHP中$this的用法與存取限定符詳解

修改JavaScript中的this指向的多種方法

JavaScript中的this規則及this物件用法實例

#

以上是js中this的指向問題探討的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

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

熱門話題

Java教學
1656
14
CakePHP 教程
1415
52
Laravel 教程
1309
25
PHP教程
1257
29
C# 教程
1229
24
簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

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

如何在JavaScript中取得HTTP狀態碼的簡單方法 如何在JavaScript中取得HTTP狀態碼的簡單方法 Jan 05, 2024 pm 01:37 PM

JavaScript中的HTTP狀態碼取得方法簡介:在進行前端開發中,我們常常需要處理與後端介面的交互,而HTTP狀態碼就是其中非常重要的一部分。了解並取得HTTP狀態碼有助於我們更好地處理介面傳回的資料。本文將介紹使用JavaScript取得HTTP狀態碼的方法,並提供具體程式碼範例。一、什麼是HTTP狀態碼HTTP狀態碼是指當瀏覽器向伺服器發起請求時,服務

深入探討:Django框架是什麼? 深入探討:Django框架是什麼? Jan 19, 2024 am 09:23 AM

Django框架是一種用於Web應用程式的Python框架,它提供了一個簡單而強大的方式來創建Web應用程式。事實上,Django已成為目前最受歡迎的PythonWeb開發框架之一,也成為許多公司的首選,包括Instagram和Pinterest。本文將深入探討Django框架是什麼,包括基礎概念和重要元件,以及具體程式碼範例。 Django基礎概念Djan

JavaScript和WebSocket:打造高效率的即時搜尋引擎 JavaScript和WebSocket:打造高效率的即時搜尋引擎 Dec 17, 2023 pm 10:13 PM

JavaScript和WebSocket:打造高效率的即時搜尋引擎引言:隨著網路的發展,使用者對即時搜尋引擎的要求也越來越高。傳統的搜尋引擎在進行搜尋時,使用者需要點擊搜尋按鈕後才能得到結果,這種方式無法滿足使用者對於即時搜尋結果的需求。因此,採用JavaScript和WebSocket技術來實現即時搜尋引擎成為了一個熱門的話題。本文將詳細介紹使用JavaScri

如何使用WebSocket和JavaScript實現線上電子簽名系統 如何使用WebSocket和JavaScript實現線上電子簽名系統 Dec 18, 2023 pm 03:09 PM

如何使用WebSocket和JavaScript實現線上電子簽名系統概述:隨著數位化時代的到來,電子簽名被廣泛應用於各個產業中,以取代傳統的紙本簽名。 WebSocket作為全雙工通訊協議,可以與伺服器進行即時的雙向資料傳輸,結合JavaScript可以實現一個線上電子簽名系統。本文將介紹如何使用WebSocket和JavaScript來開發一個簡單的在線

深入探討Linux中常見的特殊字符 深入探討Linux中常見的特殊字符 Mar 14, 2024 pm 02:54 PM

Linux作業系統作為一種常用的開源作業系統,具有強大的可自訂性和靈活性。在使用Linux系統時,我們經常會遇到各種特殊字元的處理。這些特殊字元在命令列中具有特殊的意義,能夠實現許多高階功能。本文將深入探討Linux中常見的特殊字符,並結合具體的程式碼範例來詳細介紹它們的用法。通配符:通配符是用來匹配檔案名稱的特殊字符,常見的通配符包括*、?、[]等。下面是幾種

深入探討:Go語言中的單線程特性 深入探討:Go語言中的單線程特性 Mar 15, 2024 pm 02:09 PM

Go語言作為一種現代化的程式語言,以其簡潔高效的特性在近年來受到越來越多開發者的喜愛和青睞。其中一個讓人獨特的地方就是其單線程特性。在傳統的多執行緒程式語言中,開發者通常需要手動管理執行緒之間的同步和互斥,而在Go語言中,借助其獨特的協程(Goroutine)和通訊機制(channel),可以方便且高效地實現並發程式設計。一、Goroutine與單線程:Go語言中的

Golang的本質是腳本語言還是編譯語言?探討 Golang的本質是腳本語言還是編譯語言?探討 Mar 19, 2024 pm 03:12 PM

Golang的本質是腳本語言還是編譯語言?探討Golang,也稱為Go語言,是一種由Google開發的靜態型別程式語言。自誕生以來,Golang一直備受開發者關注,其優秀的並發性能、簡潔的語法和跨平台特性使其在各個領域得到廣泛應用。然而,關於Golang到底是腳本語言還是編譯語言,卻一直存在爭議。腳本語言和編譯語言在運行時的不同方式給人留下了深刻的印象

See all articles