摘要:前提知識在實現克隆函數之前你需要明白以下一些概念如果你已經明白了請直接閱讀實現部分什么是值類型引用類型很多新手可能會對值類型引用類型原始類型基本類型等等名稱感到困惑這里就解釋一下這些概念一個事物是可以有多種區分形式的比如貓我們可以說它是貓科
前提知識
在實現克隆函數之前,你需要明白以下一些概念,如果你已經明白了,請直接閱讀 “實現” 部分.
什么是值類型、引用類型?很多新手可能會對 “值類型”、“引用類型”、“原始類型”、“基本類型”等等名稱感到困惑. 這里就解釋一下這些概念.
一個事物是可以有多種區分形式的.
比如,貓,我們可以說它是貓科動物,也可以說它是哺乳動物,也可以說它是食肉動物.
在編程語言的世界里也是一樣的.
在JavaScript的世界里, 數據被定義為以下 7 種 數據類型 :
6種 原始類型(又叫 基本類型):
Boolean
Null
Undefined
Number
String
Symbol
和 Object
(需要注意的是, 名詞從英文翻譯成中文,可能會出現多種叫法,比如“primitive type”,中文叫 “原始類型”,也有叫“基本類型”.)
另外,根據變量值傳遞的方式,我們又可以將數據區分為“值類型”和“引用類型”.
值類型 : 數據在傳遞和賦值時,數據將自己復制一份給對方.
JavaScript中原始類型都屬于值類型(string, number, boolean, null, undefined, symbol).
引用類型 : 在傳遞和賦值時, 數據將自身的引用(又叫“地址”、“指針”)給對方.
JavaScript中數組、函數、自定義對象,三種屬于引用類型.
更詳細的解釋請閱讀: //TODO: (新建文章,介紹 值類型、引用類型)
實現引用類型數據都是由原始類型數據組成的,因此我們可以將引用類型數據一層層往下拆, 將里面的每一個原始類型數據賦值給新對象.
基于上述思路,我們主要對 數組、函數、自定義對象 這些引用類型的數據進行特殊處理,
Object.prototype.clone = function(){ ? ? ? ? ? var copy = this.constructor === Array ? [] : {}; //#1 ? ? ? ? for(var e in this){ if (typeof this[e] ?=== "object") { //#2 copy[e] = ?this[e].clone(); } else if (typeof this[e] ?=== "function") { //#3 copy[e] = ? this[e].bind(copy); //#5 } else { //#4 copy[e] = ?this[e]; } ? ? ? ? } ? ? ? ? return copy; }
#1: 判斷傳入的對象是數組類型的對象,還是其它類型的對象.
#2、#3: Array 和 Object 的 typeof是 “object”, Function 的typeof 是“function”. 它們都是引用類型,因此特殊處理.
//typeof 用于引用類型的數據 typeof Array(); // "object" typeof Object(); // "object" typeof function(){}; // "function"
#4: 原始類型直接賦值.
#5: 創建一個新的函數,并且將新函數與 copy 對象綁定.
JavaScript 數據類型和數據結構
Difference between a Value Type and a Reference Type
Javascript之實現一個clone克隆函數
JavaScript: clone a function
Function.prototype.bind()
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/101947.html
摘要:使用構造函數的原型繼承相比使用原型的原型繼承更加復雜,我們先看看使用原型的原型繼承上面的代碼很容易理解。相反的,使用構造函數的原型繼承像下面這樣當然,構造函數的方式更簡單。 五天之前我寫了一個關于ES6標準中Class的文章。在里面我介紹了如何用現有的Javascript來模擬類并且介紹了ES6中類的用法,其實它只是一個語法糖。感謝Om Shakar以及Javascript Room中...
摘要:它接受任意數量的源對象,枚舉它們的所有屬性并分配給。所以現在怎么辦有幾種方法可以創建一個對象的深拷貝。為了防止發生任何意外,請使用而不是。我想測量哪種方法是最高性能的。圖表以下是,和中不同技術的性能。 原文:Deep-copying in JavaScript - DasSur.ma 如何在 JavaScript 中拷貝一個對象?對于這個很簡單的問題,但是答案卻不簡單。 引用傳值 在...
摘要:的對象只是指向內存中某個位置的指針。所以在拷貝中的對象時,要根據實際情況做一些考慮。結論中最好的對象拷貝的算法,很大程度上取決于其使用環境,以及你需要拷貝的對象類型。 翻譯:瘋狂的技術宅原文:https://smalldata.tech/blog/2... 本文首發微信公眾號:前端先鋒歡迎關注,每天都給你推送新鮮的前端技術文章 在開始之前,我先普及一些基礎知識。Javascrip...
摘要:引用類型之所以會出現深淺拷貝的問題,實質上是由于對基本類型和引用類型的處理不同。另外方法可以視為數組對象的淺拷貝。上面描述過的復雜問題依然存在,可以說是最簡陋但是日常工作夠用的深拷貝方式。 一直想梳理下工作中經常會用到的深拷貝的內容,然而遍覽了許多的文章,卻發現對深拷貝并沒有一個通用的完美實現方式。因為對深拷貝的定義不同,實現時的edge case過多,在深拷貝的時候會出現循環引用等問...
摘要:對象會記住它的原型給對象提供了一個名為的隱藏屬性,某個對象的屬性默認會指向它的構造器的原型對象,即。我們通過代碼來驗證再來實際上,就是對象跟對象構造器的原型聯系起來的紐帶切記這句話,對未來理解原型鏈很有幫助。 封裝 封裝數據 在許多語言的對象系統中,封裝數據是由語法解析來實現的,這些語言也許提供了 private、public、protected 等關鍵字來提供不同的訪問權限。例如:j...
閱讀 2028·2021-11-12 10:36
閱讀 1892·2021-11-09 09:49
閱讀 2606·2021-11-04 16:12
閱讀 1154·2021-10-09 09:57
閱讀 3246·2019-08-29 17:24
閱讀 1919·2019-08-29 15:12
閱讀 1279·2019-08-29 14:07
閱讀 1295·2019-08-29 12:53