Object.create()對對象屬性prototype和__proto__的影響

下面是一段判斷信息詳情是否有修改的邏輯，貼上項目展現：

那麼問題來了，你們自行腦補一下如何判斷圖片是否有修改。

1、下面看兩道關於Object.create()的經典面試題

第1題

var a = { name: 'kelen' };
var b = Object.create(a);
b.name = 'boke';
console.log(a.name);

第2題

var a = { person : { name: 'kelen' } };
var b = Object.create(a);
b.person.name = 'kobe';
console.log( a.person.name );

思考

爲何第一個修改obj2的name屬性，obj1的name輸出是one，而第二個卻能夠改變呢？

2、解釋：Object.create函數

Object.create()方法建立一個擁有指定原型和若干個指定屬性的對象。

語法

Object.create(proto, [ propertiesObject ])

參數

proto

一個對象，做爲新建立對象的原型。

propertiesObject

可選。該參數對象是一組屬性與值，該對象的屬性名稱將是新建立的對象的屬性名稱，值是屬性描述符（這些屬性描述符的結構與Object.defineProperties()的第二個參數同樣）。注意：該參數對象不能是 undefined，另外只有該對象中自身擁有的可枚舉的屬性纔有效，也就是說該對象的原型鏈上屬性是無效的。

拋出異常

若是 proto 參數不是 null 或一個對象值，則拋出一個 TypeError 異常

返回值

一個具備指定的內部原型且包含指定的屬性（若是有）的新對象。

3、題目詳解

Object.prototype 屬性表示對象 Object 的原型對象。

__proto__ 屬性表示對象 Object 的原型，原型的值能夠是一個對象也能夠爲null，好比說Object.prototype.__proto__就是null

從上面的例子分析，當var b = Object.create(a);的時候，不等同於b = a，實際上就是

b.__proto__ ==> a; 

b.prototype ==> a.prototype;

當咱們對b.name = "kobe"的時候，其實是在b對象新增一個屬性，而且賦值，可是在b.name = "kobe"以前打印console.log(b.name);的時候輸出"kelen"，是由於在原型鏈去找到a的name屬性，因此能夠取到a的值

因此下面b.name = "kobe"並不會改變a的name屬性，若是要實現a.name最後的值爲kobe的話，能夠這樣寫b.__proto__.name = "kobe";

而第二種狀況，

b.person.name = "kobe"卻能夠改變a.person.name的值是由於，b.person是一個a.person的對象引用，當b.person.name進行賦值，實際上就是對a.person.name進行修改，舉一個簡單的引用類型的例子

var a = { name: "kelen" };
var b = a;
b.name = "kobe";
console.log(a.name); // kobe

4、項目問題詳解

第1題

var a = { name: 'kelen' };
var b = Object.create(a);
b.name = 'boke';
console.log(a.name);  // kelen

第2題

var a = { person : { name: 'kelen' } };
var b = Object.create(a);
b.person.name = 'kobe';
console.log( a.person.name ); // kobe

項目代碼

//原始接口拿到的福利信息, //圖片列表對象
originInfo={
    welfareName:'中影國際',
    imageList:[
        {
            id:'5157',
            wIFImgUrl:'http://tcw-wsq.b0.upaiyun.com/2016/07/12/34/20160713165313449.jpg'
        },
        {
            id:'5158',
            wIFImgUrl:'http://tcw-wsq.b0.upaiyun.com/2016/07/14/34/20160732112832397.jpg'
        }
    ]
};

//$scope.welfareInfo=originInfo;  //no，徹底行不通
//$scope.welfareInfo=Object.create(originInfo); //no，不能夠
var originInfoCy=JSON.stringify(originInfo);  //stringify用於從一個對象解析出字符串
$scope.welfareInfo=JSON.parse(originInfoCy);  //parse 用於從一個字符串中解析出json 對象

對於這個問題正確的處理方法是，將originInfo對象轉變成字符串，字符串並非引用類型的，繼而再轉換成對象，它就完美解決問題啦啦。。。