javascript實(shí)現(xiàn)數(shù)組或?qū)ο蟮纳羁截?

Fundebug 發(fā)布于2019-08-23 15:35 / 2179人閱讀

摘要：實(shí)現(xiàn)深拷貝有兩種方法第一簡單粗暴可以看出來，改變原數(shù)組，并沒有對新數(shù)組產(chǎn)生影響改變新數(shù)組也沒有對原數(shù)組產(chǎn)生影響第二面試官大多數(shù)會問這種方法判斷是數(shù)組還是對象判斷是值類型還是引用類型引用類型的話進(jìn)行遞歸操作值類型直接賦值同樣改變原數(shù)組，并沒有

js實(shí)現(xiàn)深拷貝有兩種方法

第一（簡單粗暴）：

let arr = [1, {a: 2}];
let copyArr = JSON.parse( JSON.stringify(arr) );
console.log(copyArr )  // [1, {a: 2}]
arr[1].a = 3;
console.log(copyArr )  // [1, {a: 2}]
copyArr[1].a = 5;
console.log(arr)       // [1, {a: 2}]

可以看出來，改變原數(shù)組arr，并沒有對新數(shù)組copyArr產(chǎn)生影響；改變新數(shù)組copyArr也沒有對原數(shù)組arr產(chǎn)生影響；

第二（面試官大多數(shù)會問這種方法）：

let arr = [1, {a: 2}];

function deepCopy(arr) {
    let copyArr = (arr.constructor === Array) ? [] : {}; // 判斷是數(shù)組還是對象
    for(let i in arr) {
        if(typeof arr[i] === "object") {   // 判斷是值類型還是引用類型
            copyArr[i] = deepCopy(arr[i]);  // 引用類型的話進(jìn)行遞歸操作
        } else {
            copyArr[i] = arr[i];  // 值類型直接賦值
        }
    }
    return copyArr;
}

let copyArr = deepCopy(arr);
console.log(copyArr )  // [1, {a: 2}]
arr[1].a = 3;
console.log(copyArr )  // [1, {a: 2}]
copyArr[1].a = 5;
console.log(arr)       // [1, {a: 2}]

同樣：改變原數(shù)組arr，并沒有對新數(shù)組copyArr產(chǎn)生影響；改變新數(shù)組copyArr也沒有對原數(shù)組arr產(chǎn)生影響；

云服務(wù)器 GPU云服務(wù)器 javascript對象數(shù)組數(shù)組拷貝拷貝數(shù)組 javascript或

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/102288.html

相關(guān)文章

javascript對象的淺拷貝、深拷貝和Object.assign方法淺析

摘要：對象的淺拷貝淺拷貝是對象共用一個(gè)內(nèi)存地址，對象的變化相互影響。這是特別值得注意的地方。和能正確處理的對象只有等能夠被表示的數(shù)據(jù)結(jié)構(gòu)，因此函數(shù)這種不能被表示的類型將不能被正確處理。對象的淺拷貝：淺拷貝是對象共用一個(gè)內(nèi)存地址，對象的變化相互影響。比如常見的賦值引用就是淺拷貝: let srcObj = {name: lilei, age: 20}; let copyObj = srcO...

lixiang 2019-08-22 15:55 評論0 收藏0
低門檻徹底理解JavaScript中的深拷貝和淺拷貝

摘要：案例中的賦值就是典型的淺拷貝，并且深拷貝與淺拷貝的概念只存在于引用類型。修改修改經(jīng)測試，也只能實(shí)現(xiàn)一維對象的深拷貝。經(jīng)過驗(yàn)證，我們發(fā)現(xiàn)提供的自有方法并不能徹底解決的深拷貝問題。在說深拷貝與淺拷貝前，我們先看兩個(gè)簡單的案例： //案例1 var num1 = 1, num2 = num1; console.log(num1) //1 console.log(num2) //1 num...

wind3110991 2019-08-22 16:02 評論0 收藏0
javascript的深拷貝方法總結(jié)（主要針對數(shù)組和對象進(jìn)行整理）

摘要：回顧一下我們總結(jié)的常用的深拷貝完整方案實(shí)現(xiàn)一個(gè)函數(shù)，可以對中的種主要的數(shù)據(jù)類型包括進(jìn)行值復(fù)制對數(shù)組深拷貝的簡單方法總結(jié)循環(huán)實(shí)現(xiàn)數(shù)組的深拷貝只適應(yīng)單層數(shù)組結(jié)構(gòu)方法實(shí)現(xiàn)數(shù)組的深拷貝只適應(yīng)單層數(shù)組結(jié)構(gòu)方法實(shí)現(xiàn)數(shù)組的深拷貝只適應(yīng)單層數(shù)組結(jié)構(gòu)擴(kuò)展回顧一下我們總結(jié)的常用的深拷貝完整方案實(shí)現(xiàn)一個(gè)函數(shù)clone，可以對JavaScript中的5種主要的數(shù)據(jù)類型（包括Number、String、Ob...

church 2019-08-21 17:47 評論0 收藏0
JS 中的深拷貝與淺拷貝

摘要：什么是深拷貝淺拷貝見名知義，無論是深拷貝還是淺拷貝，都是的問題。使用如下以上就是關(guān)于中的深拷貝與淺拷貝的知識和如何進(jìn)行深拷貝的知識了，如果有錯或者有其他方式的話，歡迎在下面留言評論啦前言最近在寫項(xiàng)目的時(shí)候涉及到一些父子組件傳遞個(gè)對象或者數(shù)組通信啥的，或者是直接復(fù)制添加對象啥的，直接使用賦值的時(shí)候總會出錯。一查原來是淺拷貝的問題，就從網(wǎng)上找了點(diǎn)資料，匯總到這里來了。 1 什么是深拷貝...

ztyzz 2019-08-23 13:41 評論0 收藏0
javascript的深拷貝VS淺拷貝

摘要：深拷貝淺拷貝本文主要對深拷貝淺拷貝的解釋及實(shí)現(xiàn)做一下簡單記錄。之所以會有深拷貝與淺拷貝之分，是因?yàn)椴煌瑪?shù)據(jù)類型的數(shù)據(jù)在內(nèi)存中的存儲區(qū)域不一樣。但注意，只能做一層屬性的淺拷貝。深拷貝VS淺拷貝本文主要對深拷貝&淺拷貝的解釋及實(shí)現(xiàn)做一下簡單記錄。原文鏈接，歡迎star。之所以會有深拷貝與淺拷貝之分，是因?yàn)椴煌瑪?shù)據(jù)類型的數(shù)據(jù)在內(nèi)存中的存儲區(qū)域不一樣。堆和棧是計(jì)算機(jī)中劃分出來用來存儲的...

Nekron 2019-08-23 15:08 評論0 收藏0