深淺拷貝以及函數緩存

目錄

數據類型介紹

基本數據類型(Primitive Types)

引用數據類型(Reference Types)

淺拷貝

深拷貝

利用JSON的序列化和反序列化實現深拷貝

遞歸實現深拷貝

第三方庫lodash的cloneDeep

函數緩存的概念

?實現方法


數據類型介紹

要想了解深淺拷貝,首先得知道有哪些數據類型。在Javascript中,存在兩大數據類型:

基本數據類型(Primitive Types)

JavaScript的基本數據類型包括以下六種:

  • Number: 用于表示整數或浮點數。例如:423.14
  • String: 用于表示文本數據。例如:"hello"'world'
  • Boolean: 表示邏輯值,只有truefalse兩種。
  • Undefined: 表示變量未定義或未賦值。例如:let a;,此時aundefined
  • Null: 表示空值,通常用于明確賦空值的情況。例如:let b = null;
  • Symbol(ES6新增):表示唯一且不可變的值,通常用于對象屬性的鍵。例如:Symbol('id')

基本數據類型的特點是不可變,直接存儲在棧內存中。

引用數據類型(Reference Types)

引用數據類型主要包括以下兩種:

  • Object: 用于存儲鍵值對或復雜數據結構。例如:{ name: "Alice", age: 25 }
  • Array: 是特殊的對象,用于存儲有序數據。例如:[1, 2, 3]
  • Function: 也是對象的一種,可以被調用執行。例如:function() { return "hello"; }
  • DateRegExp等內置對象。

引用數據類型的特點是可變,數據存儲在堆內存中,變量存儲的是指向堆內存的地址。

在編程中,基本數據類型通常不涉及深拷貝或淺拷貝的概念。所以面試常問的深淺拷貝指的是針對引用數據的處理。

淺拷貝

僅復制對象的頂層屬性,如果屬性是引用類型(如數組、對象),則復制的是引用而非實際對象。因此,修改拷貝后的引用類型屬性會影響原對象。

實現淺拷貝的方式有很多,舉幾個案例:

 
// Object.assign()
// 使用 Object.assign() 可以快速實現淺拷貝:
const original = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, original);// 展開運算符(...)
// ES6 的展開運算符也能實現淺拷貝:
const original = { a: 1, b: { c: 2 } };
const copy = Object.assign({}, original);// 數組的淺拷貝
// 對于數組,可以使用 slice() 或 concat():
const originalArray = [1, 2, { a: 3 }];
const copyArray = originalArray.slice();

注意

引用賦值共享同一個對象,無獨立性,不屬于淺拷貝
淺拷貝第一層屬性獨立,嵌套引用類型仍共享

var a = {a:1}
var b = a

深拷貝

會遞歸復制對象的所有層級,包括引用類型屬性,生成一個完全獨立的新對象。修改深拷貝后的對象不會影響原對象。

深拷貝開辟一個新的棧,兩個對象的屬性完全相同,但是對應兩個不同的地址,修改一個對象的屬性,不會改變另外一個

利用JSON的序列化和反序列化實現深拷貝

JSON.parse(JSON.stringify())

優點:簡單易用,常見的深拷貝的方法

缺點:無法處理函數、Symbol、undefined等非 JSON 兼容類型,會丟失這些屬性

const original = { a: 1, b: { c: 2 } };
const copy = JSON.parse(JSON.stringify(original));

遞歸實現深拷貝

優點:可以處理各種類型

缺點:需要手動處理循環引用等問題

function deepClone(obj) {if (obj === null || typeof obj !== 'object') {return obj;}const clone = Array.isArray(obj) ? [] : {};for (let key in obj) {if (obj.hasOwnProperty(key)) {clone[key] = deepClone(obj[key]);}}return clone;
}

第三方庫lodash的cloneDeep

優點:功能完善,處理了各種邊界情況

缺點:需要引入額外庫

const _ = require('lodash');
const obj = {a: 1, b: {c: 2}};
const clone = _.cloneDeep(obj);

函數緩存的概念

函數緩存是一種優化技術,通過存儲函數計算結果避免重復執行相同輸入的計算。適用于計算成本高或輸入輸出穩定的場景,如遞歸、API調用或數學運算。

函數緩存,就是將函數運算過的結果進行緩存,本質上就是用空間(緩存存儲)換時間(計算過程),常用于緩存數據計算結果和緩存對象

?實現方法

實現函數緩存主要依靠閉包、柯里化、高階函數。詳解在其他文章。

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

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

相關文章

第六屆信號處理與計算機科學國際學術會議(SPCS 2025)

重要信息 官網:www.icspcs.org (詳情見官網) 時間:2025年8月15-17日 地點:西安 主題 信號處理與智能計算計算科學與人工智能網絡與多媒體技術數字信號處理 雷達信號處理 通信信號處理 臨時和傳感器網絡 模擬和…

MongoDB:一個靈活的、可擴展的 NoSQL 數據庫

🤍 前端開發工程師、技術日更博主、已過CET6 🍨 阿珊和她的貓_CSDN博客專家、23年度博客之星前端領域TOP1 🕠 牛客高級專題作者、打造專欄《前端面試必備》 、《2024面試高頻手撕題》、《前端求職突破計劃》 🍚 藍橋云課簽約作者、…

系統思考場景應用

最近一直在與不同行業頭部企業共同探討系統思考這個主題。一些新的合作伙伴也常常問我,系統思考究竟能為客戶解決什么痛點? 這兩天上課客戶的核心需求是:全局思維。在過去的幾年里,我深切體會到,隨著外部環境的快速變化…

SQL預編譯:安全高效數據庫操作的關鍵

通過占位符(如 ? 或命名參數)編寫預編譯的 SQL 語句(通常通過 PreparedStatement 實現)是數據庫操作的最佳實踐,主要好處包括:🔒 1. 防止 SQL 注入攻擊(核心安全優勢) 問…

springboot實驗室管理系統-計算機畢業設計源碼20916

摘 要 隨著高校實驗室管理需求的不斷增加,傳統的管理方式已經難以滿足現代教育的要求。為了解決這一問題,本文設計并實現了一種基于VUE和SpringBoot的實驗室管理系統。該系統采用前后端分離的架構,前端使用VUE框架,后端基于Sprin…

spdringboot共享學習室小程序 計算機畢業設計源碼27728

摘 要 共享學習室小程序是一款基于SpringBoot框架開發的移動端應用,旨在提供一個便捷的自習室預約、管理和資源共享平臺。通過該小程序,用戶可以方便地預約自習室、查看資訊、提交反饋意見,同時進行失物招領、查看訂單信息等多項操作。對于管…

JVM——JVM 的內存區域是如何劃分的?

Java 虛擬機運行時數據區分為方法區、堆、虛擬機棧、本地方法棧、程序計數器。 方法區(Method Area): [1] 存儲類信息、常量、靜態變量和即時編譯器(JIT)編譯后的代碼。 [2] 屬于線程共享區域,所有線程共享方法區內存 [3] 在 JDK8之前,HotSpot使用永久代…

SpringAi筆記

簡介 :: Spring AI 中文文檔 Spring AI 解決了 AI 集成的根本難題:將企業數據和 API 與 AI 模型連接起來。 聊天客戶端 API (ChatClient ) 發起對模型的調用和響應 創建:其中可以通過bean來注入創建好的chatClient 可以使用Qualifier注解,…

基于SD-WAN的智慧高速解決方案:高效、低成本的智能交通實踐

隨著交通網絡的智能化需求逐漸增加,智慧高速建設已成為提升通行效率、優化安全性、實現交通現代化管理的重要方向。在本文中,我們將以某智慧高速項目為例,詳細探討如何通過 SD-WAN 技術與多種智能化手段結合,實現“低成本、高效率…

Towards Low Light Enhancement with RAW Images 論文閱讀

利用 RAW 圖像實現低光增強 摘要 在本文中,我們首次進行了基準研究,詳細闡述了在低光增強中使用 RAW 圖像的優越性,并提出了一種新穎的替代方案,以更靈活和實用的方式利用 RAW 圖像。受對典型圖像處理流程的全面考慮啟發&#xff…

smolagents - 如何在mac用agents做簡單算術題

smolagent是hf推出的agent開發庫,簡潔易用。這里嘗試用smolagents完成簡單數學題目。 1 smolagents安裝 conda create -n smolagents python3.12 conda activate smolagents pip install smolagents pip install smolagents[mlx-lm] 由于是在mac使用mlx,…

【無標題】LighthouseGS:面向全景式移動拍攝的室內結構感知三維高斯潑濺

標題&#xff1a;<LighthouseGS: Indoor Structure-aware 3D Gaussian Splatting for Panorama-Style Mobile Captures> 論文&#xff1a;https://arxiv.org/pdf/2507.06109 來源&#xff1a;南京大學&#xff1b;復旦大學&#xff1b;華為諾亞實驗室 文章目錄摘要一、前…

el-table中type=“selection“選中數據如何回顯

效果如下代碼如下 關鍵函數&#xff1a;toggleRowSelection(this.tableData[i])設置默認選中數據。 <template><el-tableref"multipleTable":data"tableData"tooltip-effect"dark"style"width: 100%"selection-change"h…

為來時路,OCM拿證學習和考試

為何選擇OCM&#xff1f;OCM的含金量無需多言。全球持證人數不足萬人&#xff0c;中國地區更是寥寥千人。它不僅是技術實力的象征&#xff0c;更是通往金融、互聯網、通信等核心企業高薪崗位的“通行證”。據行業數據顯示&#xff0c;持有OCM認證的技術人員&#xff0c;薪資普遍…

beautiful-react-hooks庫——入門實踐常用hook詳解

簡介 beautiful-react-hooks 是一個專為 React 設計的高質量自定義 Hooks 集合&#xff0c;涵蓋了事件、狀態、生命周期、DOM 操作、性能優化等多個方面&#xff0c;極大提升了函數組件的開發效率和代碼復用性。 安裝方法 npm install beautiful-react-hooks # 或 yarn add …

DOM 規范中的 MutationObserver 接口

MutationObserver 接口DOM規范中的 MutationObserver 接口可以在DOM被修改時異步執行回調。使用MutationObserver可以觀察整個文檔、DOM樹的一部分或某個元素&#xff0c;元素屬性、字節點、文本等。新引進的MutationObserver接口取代了已廢棄的MutationEvent。MutationObserve…

3.7 小結

圖3-7-1點云可視化點云可視化工具就像是打開點云數據寶藏大門的鑰匙&#xff0c;能讓我們直觀地理解和分析這些復雜的數據。本章節&#xff0c;主要介紹了PCL、Open3D、Matplotlib、PCShow、VTK 這幾種點云可視化工具。PCL&#xff08;Point Cloud Library&#xff09;是專注于…

對稱二叉樹、二叉樹直徑

101. 對稱二叉樹 - 力扣&#xff08;LeetCode&#xff09; 法一&#xff1a;遞歸。 對于兩個對稱位置的節點L和R&#xff08;L在左子樹&#xff0c;R在右子樹&#xff09;&#xff0c;只有當L的左節點值R的右節點值且L的右節點值R的左節點值時&#xff0c;這棵二叉樹才有可能對…

Java多線程1

線程是操作系統能夠運行調度的最小單位&#xff0c;它包含在進程之中&#xff0c;是進程的實際運作單位多線程有三種實現方式線程實現方法1&#xff0c;繼承Thread類&#xff08;無返回值&#xff09;&#xff1a;1、繼承Thread2、重寫run方法&#xff08;線程要執行的代碼&…

云計算如何提高企業的數據安全性和隱私保護

在企業數字化轉型加速推進的今天&#xff0c;數據安全與隱私保護已成為決定企業生存發展的核心命題。云計算憑借其靈活的架構優勢&#xff0c;不僅重塑了企業資源管理模式&#xff0c;更在數據安全防護領域構建起多層次保障體系。以下從六大維度解析云計算如何為企業數據安全與…