JavaScript专题之从零实现jQuery的extend about blog HOT 43 OPEN

/**
 * obj: 待拷贝的对象
 * target: 目标对象
 * parent: target的各个父级
 * _target: 用来分解target，如果有值，必有_target.target[_target.key] === target，主要用来while赋值用。（出现自引用）
 **/
function deepCopy(obj, target, parent = null, _target = null) {
    target = target || {};

    let _parent = parent;
    while (_parent) {
        if (_parent.parentObj === obj) {
            _target.target[_target.key] = obj;
            // 不能直接给target赋值，否则引用的指针丢失，只能给target的属性赋值
            // target = obj （错！！！）
            // 所以才要把target[key]拆分成target和key
            return;
        }
        _parent = _parent.parent;
    }

    Object.keys(obj).forEach(function(key) {
        let currentCopy = obj[key];
        if (typeof currentCopy === 'object' && currentCopy !== null) {
            target[key] = currentCopy.constructor === Array ? [] : {};
            deepCopy(
                currentCopy,
                target[key],
                {
                    parentObj: obj, // 当前target的直接父级
                    parent: parent // 保存target的所有非直接父级
                },
                {
                    // 把target[key]拆分成target和key，供while赋值，否则对传入的target直接赋值会导致指针丢失
                    target: target,
                    key: key
                }
            );
        } else {
            target[key] = currentCopy;
        }
    });

    return target;
}

var isObject = function (data) {
  return Object.prototype.toString.call(data) === '[object Object]'
}

var extend = function(deep) {
  var sources = typeof deep === 'boolean' && deep ? Array.prototype.slice.call(arguments, 1) : Array.prototype.slice.call(arguments)
  var i = 0;
  var obj = {};
  for (; i < sources.length; i++) {
    if (!isObject(sources[i])) {
      console.error("Function[extend] parmas must be Object")
      return false
    }
    for (var key in sources[i]) {
      if (deep === true && isObject(sources[i][key]) && obj[key]) {
        obj[key] = extend(deep, obj[key], sources[i][key])
        continue
      }
      if (sources[i].hasOwnProperty(key)) {
        obj[key] = sources[i][key]
      }

    }
  }
  return obj;
}

function extend() {
    // 默认不进行深拷贝
    var deep = false;
    var name, options, src, copy;
    var length = arguments.length;
    // 记录要复制的对象的下标
    var i = 1;
    // 第一个参数不传布尔值的情况下,target默认是第一个参数
    var target = arguments[0] || {};
    // 如果第一个参数是布尔值,第二个参数才是target
    if (typeof target == 'boolean') {
        deep = target;
        target = arguments[i] || {};
        i++;
    }
    // 如果target不是对象,我们无法进行复制的所以设为{}
    if (typeof target !== 'object') {
        target = {}
    }
    for (; i < length; i++) { // 从i 开始 没有deep i = 1 有deep i = 2
        options = arguments[i]
        if (options !== null) { //不为null和undefined
            for (name in options) {

                src = target[name]
                copy = options[name]

                if (deep && copy && typeof copy == 'object') {
                	console.log(deep, src, copy)
                    src = extend(deep, src, copy)
                    //  target[name] = extend(deep,src,copy)
                } else if (copy !== undefined) {
                    target[name] = copy
                }
            }
        }
    }
    return target

}

var obj1 = {
    a: 1,
    b: {
        c: 2
    }
}

var obj2 = {
    b: {
        c: [5],

    }

}

var d = extend(true, obj1, obj2)
console.log(d); // {a:1,b:{c:2}}

if (deep && copy && typeof copy == 'object') {
     console.log(deep, src, copy)
    // wrong 这样并不会修改 target[name]的值
     src = extend(deep, src, copy)
    // right
    target[name] = extend(deep,src,copy)
 } else if (copy !== undefined) {
      target[name] = copy
}

// 不是对象
var value = {
	a: 1
}
var src = value.a;

src = 2;

console.log(value.a); // 1

// 是对象
var value = {
	a: {
		num: 1
	}
}
var src = value.a;

src = 2;

console.log(value.a); // {num: 1}

window.undefined = null;
console.log(window.abc === undefined); // false

var n = window.abc; // 实际上 abc 并没有被设置，n 为 undefined
window[n]='text'; // 不小心更改了 undefined 的值
console.log(window.abc === undefined); // false

if (copyIsArray) {
    copyIsArray = false; 
    src = src && Array.isArray(src) ? src : [];

}

var a = {
    a:{
        b:{
            c:{
                d:b
            }
        }
    }
}
var b = {
    a:{
        b:{
            c:{
                d:a
            }
        }
    }
}
var c = extend(a, b);

var  a = {
    b: 1
}
console.log(a.c) // undefined