JS實(shí)現(xiàn)深拷貝的幾種簡單方法示例
一、使用 JSON 轉(zhuǎn)換
這是最簡單的方法。
JSON.parse(JSON.stringify(obj))
二、使用遞歸
通過遞歸的方式深度遍歷對象,將每個(gè)屬性的值進(jìn)行復(fù)制。需要處理被復(fù)制對象為值類型的情況以及屬性值中包含對象的情況。需要注意的是,為了防止循環(huán)引用導(dǎo)致死循環(huán),需要記錄已經(jīng)遍歷過的對象。
const deepClone = obj => { if (typeof obj !== 'object' || obj === null) { return obj; } let result = Array.isArray(obj) ? [] : {}; for (let key in obj) { if (obj.hasOwnProperty(key)) { result[key] = deepClone(obj[key]); } } return result; }
三、借助插件
Lodash
Lodash
是一個(gè)一致性、模塊化、高性能的 JavaScript
實(shí)用工具庫。
npm i --save lodash
import {cloneDeep} from 'lodash';
const obj1 = {a: {b: 2}}; const obj2 = cloneDeep(obj1);
總結(jié)
到此這篇關(guān)于JS實(shí)現(xiàn)深拷貝的幾種簡單方法的文章就介紹到這了,更多相關(guān)JS實(shí)現(xiàn)深拷貝內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javascript removeChild 導(dǎo)致的內(nèi)存泄漏
最近看到司徒正美的一篇文章《移除DOM節(jié)點(diǎn)》,文中說到在IE中移除容器類節(jié)點(diǎn),會(huì)引起內(nèi)存泄露。2010-08-08詳談js對url進(jìn)行編碼和解碼(三種方式的區(qū)別)
下面小編就為大家?guī)硪黄斦刯s對url進(jìn)行編碼和解碼(三種方式的區(qū)別)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-08-08JS實(shí)現(xiàn)根據(jù)密碼長度顯示安全條功能
這篇文章主要介紹了基于JS實(shí)現(xiàn)根據(jù)密碼長度顯示安全條功能,非常不錯(cuò),在一些網(wǎng)站上經(jīng)常會(huì)遇到此功能,需要的的朋友參考下實(shí)現(xiàn)代碼吧2017-03-03兼容ie和firefox的鼠標(biāo)經(jīng)過(onmouseover和onmouseout)實(shí)現(xiàn)--簡短版
兼容ie和firefox的鼠標(biāo)經(jīng)過(onmouseover和onmouseout)實(shí)現(xiàn)--簡短版...2007-11-11JavaScript實(shí)現(xiàn)相冊彈窗功能(zepto.js)
這篇文章主要介紹了JavaScript基于zepto.js實(shí)現(xiàn)相冊彈窗功能的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-06-06如何在JavaScript中等分?jǐn)?shù)組的實(shí)現(xiàn)
這篇文章主要介紹了如何在JavaScript中等分?jǐn)?shù)組的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12Bootstrap3 圖片(響應(yīng)式圖片&圖片形狀)
這篇文章主要介紹了 Bootstrap3 圖片 響應(yīng)式圖片和圖片形狀的相關(guān)資料,需非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2017-01-01