数组以及对象的深拷贝

今天写React的时候碰到了这么一个问题：

1、三个组件 A > B > C（A是B的父组件，B是C的父组件）；
2、A中有一个对象let person = {age: 33, name: "Mike"}；
3、A将传给了B组件，B做了如下操作this.state = {person: this.props.person}；
4、B再将它传给了C组件，C也做了同样的操作this.state = {person: this.props.person}；
5、然后，我将C组件中的 this.state.person 进行修改，A中的person同样也被修改了。

我找了好久，判断了各种东西都没有影响到这个person，也没有影响到A组件，我在A的render中打了一个断点，发现中间并没有经过过。

之后我推测了一下，大概是因为在生成this.state之后，不使用setState，是不会触发render的，但是也是能改变this.state的值。

NEVER mutate this.state directly, as calling setState() afterwards may replace the mutation you made. Treat this.state as if it were immutable.

官方文档是这么写的，在使用this.state的时候要将this.state认为是不可修改的。

扯远了，首先我们要知道深拷贝和浅拷贝的含义。

浅拷贝的含义在网上存在着很大的分歧，主要意见是下面两种：

第一种是等号的直接赋值 var objNew = objOld; 这样做只是将对象的引用地址复制了一下，当修改objOld的值的时候，objNew中间的值也会相对应的修改，因为引用的都是同一个对象，只有这样的对象才可以===。

var a = {a: 1,b: 2};
var b = a;
a.a = 3;
console.log(a === b);  // true

引用的同一对象进行修改，两个对象a、b引用的地址没变，当然还是相等的。

第二种是对象的第一层属性引用。

function shallowCopy(src) {
  var dst = {};
  for (var prop in src) {
    if (src.hasOwnProperty(prop)) {
      dst[prop] = src[prop];
    }
  }
  return dst;
}

就是简单的对对象的第一层进行引用复制，如果第一层中有对象或者数组，那么就还是地址引用，但是这第一层的属性有改动，另一个对象是不会有改变的。

深拷贝是对一个对象进行完整复制，但是所有的属性都不是引用。它不仅将原对象的各个属性逐个复制出去，而且将原对象各个属性所包含的对象也依次采用深拷贝的方法递归复制到新对象上。

function deepCopy (oldObj, newObj) {
    newObj = newObj || {};
    for(var name in oldObj){
        If( typeof p[name] === “object” ){
            newObj[name] = ( oldObj[name].constructor === Array )? [ ] : { };
            deepCopy(oldObj[name], newObj[name]);
        }else{
            newObj[name] = oldObj[name];
        }
    }
    return newObj;
}

最近项目组相当忙了，看着一片绿油油的加班时间。开始畅想网易阿里大公司到底会加班加成什么样子。

最近上班情况

不说这个了。

最近在写React，项目正在从Backbone转型到React，嗯，自己一个人搞，也不难嘛。