JS中call()、apply()、bind()改變this指向的原理

大家如果想了解改變this指向的方法,大家可以閱讀本人的這篇改變this指向的六種方法
大家有沒有想過這三種方法是如何改變this指向的?我們可以自己寫嗎?
答案是:可以自己寫的
讓我為大家介紹一下吧!

1.call()方法的原理

	Function.prototype.calls = function (context, ...a) {// 如果沒有傳或傳的值為空對象 context指向windowif (typeof context == null || context == undefined) {context = window;}// 創造唯一的key值  作為我們構造的context內部方法名let fn = Symbol();// this指向context[fn]方法context[fn] = this;return context[fn](...a);}let obj = {func(a,b){console.log(this);console.log(this.age);console.log(a);console.log(b);}}let obj1 = {age:"張三"}obj.func.calls(obj1,1,2);

打印結果:
在這里插入圖片描述

2.apply()方法的原理

	// apply與call原理一致  只是第二個參數是傳入的數組Function.prototype.myApply = function (context, args) {if (!context || context === null) {context = window;}// 創造唯一的key值  作為我們構造的context內部方法名let fn = Symbol();context[fn] = this;// 執行函數并返回結果return context[fn](...args);};let obj = {func(a, b) {console.log(this);console.log(this.age);console.log(a);console.log(b);}}let obj1 = {age: "張三"}obj.func.myApply(obj1, [1,2]);

打印結果:
在這里插入圖片描述

3.bind()方法的原理

	Function.prototype.myBind = function (context) {// 如果沒有傳或傳的值為空對象 context指向windowif (typeof context === "undefined" || context === null) {context = window}let fn = Symbol(context)context[fn] = this //給context添加一個方法 指向this// 處理參數 去除第一個參數this 其它傳入fn函數let arg = [...arguments].slice(1) //[...xxx]把類數組變成數組 slice返回一個新數組context[fn](arg) //執行fndelete context[fn] //刪除方法}let obj = {func(a) {console.log(this);console.log(this.age);}}let obj1 = {age: "張三"}obj.func.myBind(obj1);

打印結果:
在這里插入圖片描述
感謝大家的閱讀,如有不對的地方,可以向我提出,感謝大家!

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/209358.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/209358.shtml
英文地址,請注明出處:http://en.pswp.cn/news/209358.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Python 語言在 Web 開發上有哪些應用框架?

Python 是一門多用途的編程語言,其簡潔、易讀且強大的特性使其成為Web開發領域的一種熱門選擇。Python Web開發框架提供了豐富的工具和功能,使得開發者能夠更高效地構建各種規模和類型的Web應用。以下是一些在Python Web開發中常用的框架,每個…

[mysql]linux安裝mysql5.7

之前安裝的時候遇到了很多問題,浪費了一些時間。整理出這份教程,照著做基本一遍過。 這是安裝包: 鏈接:https://pan.baidu.com/s/1gBuQBjA4R5qRYZKPKN3uXw?pwd1nuz 1.下載安裝包,上傳到linux。我這里就放到downloads目錄下面…

WaitGroup原理分析

背景 在實際業務開發中,我們會遇到以下場景:請求數據庫,批量獲取1000條數據記錄后,處理數據 為了減少因一次批量獲取的數據太多,導致的數據庫延時增加,我們可以把一次請求拆分成多次請求,并發去…

C#-快速剖析文件和流,并使用

目錄 一、概述 二、文件系統 1、檢查驅動器信息 2、Path 3、文件和文件夾 三、流 1、FileStream 2、StreamWriter與StreamReader 3、BinaryWriter與BinaryReader 一、概述 文件,具有永久存儲及特定順序的字節組成的一個有序、具有名稱的集合; …

大模型的全方位評估

摘要: 評估通過提供一種跟蹤進度、理解模型以及記錄其能力和偏差的方法,為基礎大模型提供了背景。基礎大模型挑戰了機器學習中標準評估范式實現這些目標的能力,因為它們距離特定任務只有一步之遙。為了設想適合基礎模型的評估新范式&#xff…

枚舉 LeetCode2048. 下一個更大的數值平衡數

如果整數 x 滿足:對于每個數位 d ,這個數位 恰好 在 x 中出現 d 次。那么整數 x 就是一個 數值平衡數 。 給你一個整數 n ,請你返回 嚴格大于 n 的 最小數值平衡數 。 如果n的位數是k,n它的下一個大的平衡數一定不會超過 k1個k1…

圖論——最小生成樹

圖論——最小生成樹 A wise man changes his mind, a fool never will 生成樹 一個連通圖的生成樹是一個極小的連通子圖,它包含圖中全部的n個頂點,但只有構成一棵樹的n-1條邊。 最小生成樹 在這些邊中選擇N-1條出來,連接所有的N個點。這N-1…

Java后端的登錄、注冊接口是怎么實現的

目錄 Java后端的登錄、注冊接口是怎么實現的 Java后端的登錄接口是怎么實現的 Java后端的注冊接口怎么實現? 如何防止SQL注入攻擊? Java后端的登錄、注冊接口是怎么實現的 Java后端的登錄接口是怎么實現的 Java后端的登錄接口的實現方式有很多種&a…

使用git出現的問題

保證 首先保證自己的git已經下載 其次保證自己的gitee賬號已經安裝并且已經生成ssh公鑰 保證自己要push的代碼在要上傳的文件夾內并且配置文件等都在父文件夾(也就是文件沒有套著文件) 問題 1 $ git push origin master gitgitee.com: Permission de…

近似同態加密的 IND/SIM-CPA+ 安全性:對于 CKKS 實際有效的攻擊

參考文獻: [LM21] Li B, Micciancio D. On the security of homomorphic encryption on approximate numbers[C]//Advances in Cryptology–EUROCRYPT 2021: 40th Annual International Conference on the Theory and Applications of Cryptographic Techniques, Z…

【Linux】命令expect使用詳解

🦄 個人主頁——🎐個人主頁 🎐?🍁 🪁🍁🪁🍁🪁🍁🪁🍁 感謝點贊和關注 ,每天進步一點點!加油!&…

【上海大學數字邏輯實驗報告】五、記憶元件測試

一、實驗目的 掌握R-S觸發器、D觸發器和JK觸發器的工作原理及其相互轉換。學會用74LS00芯片構成鐘控RS觸發器。學會用74LS112實現D觸發器學會在Quartus II上用D觸發器實現JK觸發器。 二、實驗原理 基本R-S觸發器是直接復位-置位的觸發器,它是構成各種功能的觸發器…

AI文檔助手,當下熱門的AI文檔助手【2024】

在當今信息爆炸的時代,文檔創作的需求愈發龐大。為了滿足用戶對高效、準確、原創性文檔的需求,人工智能技術的應用日益廣泛。本文將專心分享AI文檔助手領域的熱門推薦。 AI文檔助手的背景與應用 AI文檔助手作為人工智能技術在文檔創作領域的一大應用&am…

nginx配置自建SSL證書

文章目錄 前言配置SSL證書SSL證書放在 Nginx 而不放在應用服務器上的好處Nginx只能轉發http協議嗎Nginx轉發TCP協議會收到端口限制嗎Nginx本身能將Websocket數據轉化成TCP數據嗎總結 前言 之前的一篇文章《自建CA并生成自簽名SSL證書》中講到為什么要自建CA和自簽名SSL證書&am…

velocity-engine-core是什么?Velocity模板引擎的使用

velocity-engine-core是什么?Velocity模板引擎的使用 1. 常見的模板引擎2. Velocity 的語法3.Velocity的使用 相信在日常開發中或多或少都聽過或者使用過模板引擎,比如熟知的freemarker, thymeleaf等。而模板引擎就是為了實現View和Data分離而產生的。 而…

C++封裝、繼承(單繼承)、多態詳細分析。

系列文章目錄 文章目錄 系列文章目錄摘要一、基本概念二、多態的分類三、多態的實現3.1 類型兼容與函數重寫3.2 動態聯編與靜態聯編3.3 虛函數3.4 動態多態的實現過程 總結參考文獻 摘要 多態性特征是 C中最為重要的一個特征,熟練使用多態是學好 C的關鍵&#xff0…

Kotlin關鍵字二——constructor和init

在關鍵字一——var和val中最后提到了構造函數,這里就學習下構造函數相關的關鍵字: constructor和init。 主要構造(primary constructor) kotlin和java一樣,在定義類時就自動生成了無參構造 // 會生成默認的無參構造函數 class Person{ }與java不同的是…

configure腳本的常用參數

下面是一些常用的configure選項參數及其解釋&#xff1a; --prefix<directory>&#xff1a;指定安裝目錄--with-<package>&#xff1a;指定依賴的外部庫或軟件包--enable-<feature>&#xff1a;啟用某個特性--disable-<feature>&#xff1a;禁用某個特…

原創 | 數據的確權、流通、入表與監管研究(一):數據與確權

作者&#xff1a;張建軍&#xff0c;中國電科首席專家&#xff0c;神州網信技術總監 本文約7100字&#xff0c;建議閱讀10分鐘 本文主要介紹數據與數據分類、數據確權規則、數據的所有權與其他權利等方面內容&#xff0c;并進行案例分析。 2022年12月發布的《關于構建數據基礎制…

Linux 和 macOS 的主要區別在哪幾個方面呢?

(??? )&#xff0c;Hello我是祐言QAQ我的博客主頁&#xff1a;C/C語言&#xff0c;數據結構&#xff0c;Linux基礎&#xff0c;ARM開發板&#xff0c;網絡編程等領域UP&#x1f30d;快上&#x1f698;&#xff0c;一起學習&#xff0c;讓我們成為一個強大的攻城獅&#xff0…