Javascript中对object对象的常用操作方法，及对象拷贝

一.object对象的常用操作方法

Object.assign()

1.可以用作对象的复制

var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

2.可以用做对象的合并

var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };

var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

在上面可以看到，目标对象o1自身也发生了改变。假如我们不想让o1改变，我们可以把三个对象合并到一个空的对象中，操作如下：

var obj = Object.assign({},o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1 }

注意：以下几个地方可能copy或者合并不成功，经常在面试中出现！
1、继承属性和不可枚举属性是不能拷贝的

var obj = Object.create({foo: 1}, { // foo 是个继承属性。
bar: {
value: 2 // bar 是个不可枚举属性。
},
baz: {
value: 3,
enumerable: true // baz 是个自身可枚举属性。
}
});

var copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

2、原始类型会被包装为 object

var v1 = “abc”;
var v2 = true;
var v3 = 10;
var v4 = Symbol(“foo”)

var obj = Object.assign({}, v1, null, v2, undefined, v3, v4);
// 原始类型会被包装，null 和 undefined 会被忽略。
// 注意，只有字符串的包装对象才可能有自身可枚举属性。
console.log(obj); // { “0”: “a”, “1”: “b”, “2”: “c” }

3、异常会打断接下来的拷贝任务

var target = Object.defineProperty({}, "foo", {
    value: 1,
    writable: false
}); // target 的 foo 属性是个只读属性。

Object.assign(target, {bar: 2}, {foo2: 3, foo: 3, foo3: 3}, {baz: 4});
// TypeError: "foo" is read-only
// 注意这个异常是在拷贝第二个源对象的第二个属性时发生的。

console.log(target.bar);  // 2，说明第一个源对象拷贝成功了。
console.log(target.foo2); // 3，说明第二个源对象的第一个属性也拷贝成功了。
console.log(target.foo);  // 1，只读属性不能被覆盖，所以第二个源对象的第二个属性拷贝失败了。
console.log(target.foo3); // undefined，异常之后 assign 方法就退出了，第三个属性是不会被拷贝到的。
console.log(target.baz);  // undefined，第三个源对象更是不会被拷贝到的。

Object.create()

上面只应用了Object.create()的第一个参数，其实还有第二个参数！

Object.create(proto, [ propertiesObject ])

第二个参数是可选的，主要用于指定我们创建的对象的一些属性，（例如：是否可读、是否可写，是否可以枚举等等）可以通过下面案例来了解第二个参数！

var o;
o = Object.create(Object.prototype, {
  // foo会成为所创建对象的数据属性
  foo: { writable:true, configurable:true, value: "hello" },
  // bar会成为所创建对象的访问器属性
  bar: {
    configurable: false,
    get: function() { return 10 },
    set: function(value) { console.log("Setting `o.bar` to", value) }
}})

// 创建一个以另一个空对象为原型,且拥有一个属性p的对象
o = Object.create({}, { p: { value: 42 } })

// 省略了的属性特性默认为false,所以属性p是不可写,不可枚举,不可配置的:
o.p = 24
o.p
//42

o.q = 12
for (var prop in o) {
   console.log(prop)
}
//"q"

delete o.p
//false

//创建一个可写的,可枚举的,可配置的属性p
o2 = Object.create({}, { p: { value: 42, writable: true, enumerable: true, configurable: true } });

Object.is()

用来判断两个值是否是同一个值。

下面是一些例子，面试中可能会提及

Object.is(‘haorooms’, ‘haorooms’); // true
Object.is(window, window); // true

Object.is(‘foo’, ‘bar’); // false
Object.is([], []); // false

var test = { a: 1 };
Object.is(test, test); // true

Object.is(null, null); // true

// 特例
Object.is(0, -0); // false
Object.is(-0, -0); // true
Object.is(NaN, 0/0); // true

Object.keys()

这个方法会返回一个由给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 （两者的主要区别是 一个 for-in 循环还会枚举其原型链上的属性）。

例如：
/* 类数组对象 */
var obj = { 0 : “a”, 1 : “b”, 2 : “c”};
alert(Object.keys(obj));
// 弹出"0,1,2"

/* 具有随机键排序的数组类对象 */
var an_obj = { 100: ‘a’, 2: ‘b’, 7: ‘c’ };
console.log(Object.keys(an_obj));
// console: [‘2’, ‘7’, ‘100’]

常用其他操作
1、删除对象中的某个值
delete o.p
2、对象循环
3、对象或者数组赋值
js中对象和数组赋值，不和PHP等后端语言一样，只能赋值一层，例如：

var haorooms={};
//可以这么写

haorooms["前端博客"]="Haorooms，Aaron个人博客。记录本人工作中遇到的问题，以及经验总结和分享！";

//但是假如如下写就会报错！
haorooms["前端博客"]["des"]="Haorooms，Aaron个人博客。记录本人工作中遇到的问题，以及经验总结和分享！"

//Uncaught TypeError: Cannot set property 'des' of undefined

我们在循环多层赋值的时候可以这么写：

var haorooms={};

haorooms["前端博客"] = haorooms["前端博客"] || {};

haorooms["前端博客"]["des"]=haorooms["前端博客"]["des"] || "Haorooms，Aaron个人博客。记录本人工作中遇到的问题，以及经验总结和分享"

这样就可以多层赋值了！此方法同样可以应用在数组上面！

二.对象拷贝

浅拷贝和深拷贝都是对于Javascript中的引用类型而言的，浅拷贝就只是复制对象的引用（堆和栈的关系，简单类型Undefined，Null，Boolean，Number和String是存入堆，直接引用，object array 则是存入桟中，只用一个指针来引用值），如果拷贝后的对象发生变化，原对象也会发生变化。只有深拷贝才是真正地对对象的拷贝。

场景
除了基本类型跟null,对象之间的赋值，只是将地址指向同一个，而不是真正意义上的拷贝

将一个对象赋值给另外一个对象。
var a = [1,2,3];
var b = a;
b.push(4); // b中添加了一个4
alert(a); // a变成了[1,2,3,4]

自定义对象
var obj = {a:10};
var obj2 = obj;
obj2.a = 20; // obj2.a改变了，
alert(obj.a); // 20，obj的a跟着改变

这就是由于对象类型直接赋值，只是将引用指向同一个地址，导致修改了obj会导致obj2也被修改

1.浅拷贝
我们需要封装一个函数，来对对象进行拷贝，通过for in 循环获取基本类型，赋值每一个基本类型，才能真正意义上的复制一个对象

var obj = {a:10};
function copy(obj){
var newobj = {};
for ( var attr in obj) {
newobj[attr] = obj[attr];
}
return newobj;
}
var obj2 = copy(obj);
obj2.a = 20;
alert(obj.a); //10

这样就解决了对象赋值的问题。
2.深拷贝
但是这里存在隐患，如果obj中，a的值不是10，而是一个对象，这样就会导致在for in中，将a这个对象的引用赋值为新对象，导致存在对象引用的问题。
var obj = {a:{b:10}};
function copy(obj){
var newobj = {};
for ( var attr in obj) {
newobj[attr] = obj[attr];
}
return newobj;
}
var obj2 = copy(obj);
obj2.a.b = 20;
alert(obj.a.b); //20

因此，由于这个copy对象只是对第一层进行拷贝，无法拷贝深层的对象，这个copy为浅拷贝，我们需要通过递归，来拷贝深层的对象。将copy改造成递归即可

var obj = {a:{b:10}};
function deepCopy(obj){
if(typeof obj != ‘object’){
return obj;
}
var newobj = {};
for ( var attr in obj) {
newobj[attr] = deepCopy(obj[attr]);
}
return newobj;
}
var obj2 = deepCopy(obj);
obj2.a.b = 20;
alert(obj.a.b); //10