成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

利用深度/廣度優(yōu)先遍歷手動(dòng)實(shí)現(xiàn)JavaScript對象的深度拷貝

RobinTang / 957人閱讀

摘要：引言搜索對象的深度拷貝，往往會(huì)冒出轉(zhuǎn)換和遞歸拷貝大法。但遇到大數(shù)據(jù)量，它們都有調(diào)用棧爆棧的風(fēng)險(xiǎn)今天，我們嘗試?yán)脴涞睦蒙疃葟V度優(yōu)先遍歷來實(shí)現(xiàn)對象的深度拷貝。以下代碼在環(huán)境下全部測試通過。

引言

搜索JavaScript對象的深度拷貝，往往會(huì)冒出JSON轉(zhuǎn)換和遞歸拷貝大法。但遇到大數(shù)據(jù)量，它們都有調(diào)用棧爆棧的風(fēng)險(xiǎn)
今天，我們嘗試?yán)脴涞睦蒙疃?廣度優(yōu)先遍歷來實(shí)現(xiàn)對象的深度拷貝。以下代碼在chrome環(huán)境下全部測試通過。

深度優(yōu)先遍歷實(shí)現(xiàn)對象的深度拷貝

深度優(yōu)先遍歷對象，利用棧做中間節(jié)點(diǎn)緩存

     function deepCopy(orginObject) {
    if (orginObject == null || typeof orginObject !== "object") {
        return;
    }
    console.log("starting")
    const resultObject = {}
    const rootKey = Symbol("root");
    //深度遍歷需要?jiǎng)?chuàng)建棧
    const stack = [];
    for (let key of Object.keys(orginObject)) {
        stack.push({
            key: key,//屬性名
            value: orginObject[key],//value屬性記錄當(dāng)前節(jié)點(diǎn)下屬數(shù)據(jù)
            parent: resultObject//記錄節(jié)點(diǎn)在resultObject中的位置
        })
    }

    while (stack.length) {
        const currentNode = stack.pop();
        const parent = currentNode.parent;
        const currentKey = currentNode.key;
        const currentValue = currentNode.value;
        //若是無下屬對象，返回其值
        if (currentValue == null || typeof currentValue !== "object") {
            parent[currentKey] = currentValue;
        } else {
            //若下屬值是對象，將子節(jié)點(diǎn)壓入棧中
            parent[currentKey] = Object.prototype.toString.call(currentValue) === "[object Array]"?[]:{};
            for (let key of Object.keys(currentValue)) {
                console.log("loop:" + key, currentValue[key])
                stack.push({
                    key: key,
                    value: currentValue[key],
                    parent: parent[currentKey]
                })
            }
        }
    }
    return resultObject;
}
var copyObj = deepCopy({ a: { b: 1, d: { e: 6 } }, c: 3 });
console.log(copyObj);
廣度優(yōu)先遍歷實(shí)現(xiàn)對象的深度拷貝

廣度優(yōu)先遍歷對象，利用隊(duì)列做中間節(jié)點(diǎn)緩存

    function deepCopy(orginObject) {
    if (orginObject == null || typeof orginObject !== "object") {
        return;
    }
    console.log("starting")
    const resultObject = {}
    const rootKey = Symbol("root");
    //深度遍歷需要?jiǎng)?chuàng)建棧
    const queue = [];
    for (let key of Object.keys(orginObject)) {
        queue.push({
            key: key,//屬性名
            value: orginObject[key],//value屬性記錄當(dāng)前節(jié)點(diǎn)下屬數(shù)據(jù)
            parent: resultObject//記錄節(jié)點(diǎn)在resultObject中的位置
        })
    }

    while (queue.length) {
        const currentNode = queue.shift();
        const parent = currentNode.parent;
        const currentKey = currentNode.key;
        const currentValue = currentNode.value;
        //若是無下屬對象，返回其值
        if (currentValue == null || typeof currentValue !== "object") {
            parent[currentKey] = currentValue;
        } else {
            //若下屬值是對象，將子節(jié)點(diǎn)壓入棧中
            parent[currentKey] = Object.prototype.toString.call(currentValue) === "[object Array]"?[]:{};
            for (let key of Object.keys(currentValue)) {
                console.log("loop:" + key, currentValue[key])
                queue.push({
                    key: key,
                    value: currentValue[key],
                    parent: parent[currentKey]
                })
            }
        }
    }
    return resultObject;
}
var copyObj = deepCopy({ a: { b: 1, d: { e: 6 } }, c: 3 });
console.log(copyObj);

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/106469.html

相關(guān)文章

  • 20190805-前端筆記-利用DFS廣度優(yōu)先遍歷實(shí)現(xiàn)深拷貝

    摘要：從這步開始，才是進(jìn)行深度賦值進(jìn)一步遍歷每一個(gè)屬性，進(jìn)行賦值如果是，就直接以后賦值其他類型，直接賦值 定義一些工具函數(shù) let _toString = Object.prototype.toString // 類型庫 let map = { array: Array, object: Object, function: Func...

    shiweifu 評論0 收藏0

  • 淺談JS的淺拷貝和深拷貝(遞歸和樹遍歷)

    摘要：對象的特殊性因?yàn)閷ο蟮氖峭ㄟ^指針仔細(xì)內(nèi)存地址的，所以對象的拷貝不能像變量一般簡單的賦值，對象的賦值只是將指針的地址賦值過去而已，修改屬性值會(huì)對所有指向這個(gè)內(nèi)存地址的對象的屬性值都會(huì)被改變，見下面的例子變量賦值修改不會(huì)對造成影響對象賦值修改會(huì) 1.對象的特殊性 因?yàn)閷ο蟮氖峭ㄟ^指針仔細(xì)內(nèi)存地址的，所以對象的拷貝不能像變量一般簡單的賦值，對象的賦值只是將指針的地址賦值過去而已，修改屬性值會(huì)...

    cjie 評論0 收藏0

  • JS算法之深度優(yōu)先遍歷(DFS)和廣度優(yōu)先遍歷(BFS)

    摘要：算法之深度優(yōu)先遍歷和廣度優(yōu)先遍歷背景在開發(fā)頁面的時(shí)候，我們有時(shí)候會(huì)遇到這種需求在頁面某個(gè)節(jié)點(diǎn)中遍歷，找到目標(biāo)節(jié)點(diǎn)，我們正常做法是利用選擇器，或者，但在本文，我們從算法的角度去查找節(jié)點(diǎn)，同時(shí)理解一下深度優(yōu)先遍歷和廣度優(yōu)先遍歷的原理。 JS算法之深度優(yōu)先遍歷(DFS)和廣度優(yōu)先遍歷(BFS) 背景 在開發(fā)頁面的時(shí)候，我們有時(shí)候會(huì)遇到這種需求：在頁面某個(gè)dom節(jié)點(diǎn)中遍歷，找到目標(biāo)dom節(jié)點(diǎn)，...

    roadtogeek 評論0 收藏0

  • 實(shí)現(xiàn)深度遍歷和廣度遍歷(遞歸與非遞歸版本)

    摘要：先畫個(gè)樹，然后解釋何為深度，何為廣度第一層子集第二層子集第二層子集第三層，子集第三層第四層圖就不畫太復(fù)雜了，最高四層的結(jié)構(gòu)，如果換成的形式的話可以理解成第一層第二層 先畫個(gè)樹，然后解釋 何為深度， 何為廣度 第一層 子集 | ...

    Betta 評論0 收藏0

  • 深拷貝的終極探索（99%的人都不知道）

    摘要：劃重點(diǎn)，這是一道面試必考題，我靠這道題刷掉了多少面試者嘿嘿首先這是一道非常棒的面試題，可以考察面試者的很多方面，比如基本功，代碼能力，邏輯能力，而且進(jìn)可攻，退可守，針對不同級別的人可以考察不同難度，比如漂亮妹子就出題，要是個(gè)帥哥那就得上了， 劃重點(diǎn)，這是一道面試必考題，我靠這道題刷掉了多少面試者?(? ? ??)嘿嘿 首先這是一道非常棒的面試題，可以考察面試者的很多方面，比如基本功，代...

    qingshanli1988 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<