1. 程式人生 > 程式設計 >javascript淺層克隆、深度克隆對比及例項解析

javascript淺層克隆、深度克隆對比及例項解析

這篇文章主要介紹了javascript淺層克隆、深度克隆對比及例項解析,文中通過示例程式碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

1、淺層克隆,(引用值改變, 兩個都一起變)

var obj = {
        name : 'xiaoming',age : 12,children : ['mimi','lili','rokey']
      }
      var obj2 = {};

      function clone(origin,target) {
        var target = target || {};
         for(var prop in origin) {
           target[prop] = origin[prop];
         }
         return target;
      }

      clone(obj,obj2);

2、深度克隆 (只考慮陣列和物件)

(1)判斷是不是原始值

 (2)判斷是陣列還是物件 Object.prototype.toString.call([]) = '[object Array]' Object.prototype.toString.call({}) = '[object Object]'

(3)建立相應的陣列和物件

(4)遞迴

function deepClone(origin,target) {
        var target = target || {},toStr = Object.prototype.toString,arrStr = '[object Array]';
        for(var prop in origin) {
          if(origin.hasOwnProperty(prop)) {   //判斷是不是物件自帶的屬性
            if(origin[prop] !== 'null' && typeof(origin[prop]) == 'object') {
              if(toStr.call(origin[prop]) == arrStr) {
                target[prop] = [];
              }else {
                target[prop] = {};
              }
              deepClone(origin[prop],target[prop]);
            }else {
              target[prop] = origin[prop];
            }
          }
        }
        return target;
      }

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。