Object.assign() 方法用於將所有可列舉屬性的值從一個或多個源物件複製到目標物件。它將返回目標物件。
如果目標物件中的屬性具有相同的鍵,則屬性將被源物件中的屬性覆蓋。後面的源物件的屬性將類似地覆蓋前面的源物件的屬性。
Object.assign 方法只會複製源物件自身的並且可列舉的屬性到目標物件。該方法使用源物件的[[Get]]和目標物件的[[Set]],所以它會呼叫相關 getter 和 setter。因此,它分配屬性,而不僅僅是複製或定義新的屬性。如果合併源包含getter,這可能使其不適合將新屬性合併到原型中。為了將屬性定義(包括其可列舉性)複製到原型,應使用Object.getOwnPropertyDescriptor()和Object.defineProperty() 。
String型別和 Symbol 型別的屬性都會被複製。
在出現錯誤的情況下,例如,如果屬性不可寫,會引發TypeError,如果在引發錯誤之前添加了任何屬性,則可以更改target物件。
Object.assign 不會在那些source物件值為 或 的時候丟擲錯誤。
針對深複製,需要使用其他辦法,因為 Object.assign()複製的是屬性值。假如源物件的屬性值是一個物件的引用,那麼它也只指向那個引用。也就是說,如果物件的屬性值為簡單型別(如string, number),透過Object.assign({},srcObj);得到的新物件為;如果屬性值為物件或其它引用型別,那對於這個物件而言其實是的。
深複製的幾種實現方法JSON.stringify 和 JSON.parse
用 JSON.stringify 把物件轉換成字串,再用 JSON.parse 把字串轉換成新的物件。
可以轉成 JSON 格式的物件才能使用這種方法,如果物件中包含 function 或 RegExp 這些就不能用這種方法了。
Object.assign()複製
當物件中只有一級屬性,沒有二級屬性的時候,此方法為深複製,但是物件中有物件的時候,此方法,在二級屬性以後就是淺複製。
透過jQuery的extend方法實現深複製
更多經典前端面試題,請到github檢視或參與討論
https://github.com/daily-interview/fe-interview
Object.assign() 方法用於將所有可列舉屬性的值從一個或多個源物件複製到目標物件。它將返回目標物件。
如果目標物件中的屬性具有相同的鍵,則屬性將被源物件中的屬性覆蓋。後面的源物件的屬性將類似地覆蓋前面的源物件的屬性。
Object.assign 方法只會複製源物件自身的並且可列舉的屬性到目標物件。該方法使用源物件的[[Get]]和目標物件的[[Set]],所以它會呼叫相關 getter 和 setter。因此,它分配屬性,而不僅僅是複製或定義新的屬性。如果合併源包含getter,這可能使其不適合將新屬性合併到原型中。為了將屬性定義(包括其可列舉性)複製到原型,應使用Object.getOwnPropertyDescriptor()和Object.defineProperty() 。
String型別和 Symbol 型別的屬性都會被複製。
在出現錯誤的情況下,例如,如果屬性不可寫,會引發TypeError,如果在引發錯誤之前添加了任何屬性,則可以更改target物件。
Object.assign 不會在那些source物件值為 或 的時候丟擲錯誤。
針對深複製,需要使用其他辦法,因為 Object.assign()複製的是屬性值。假如源物件的屬性值是一個物件的引用,那麼它也只指向那個引用。也就是說,如果物件的屬性值為簡單型別(如string, number),透過Object.assign({},srcObj);得到的新物件為;如果屬性值為物件或其它引用型別,那對於這個物件而言其實是的。
深複製的幾種實現方法JSON.stringify 和 JSON.parse
用 JSON.stringify 把物件轉換成字串,再用 JSON.parse 把字串轉換成新的物件。
可以轉成 JSON 格式的物件才能使用這種方法,如果物件中包含 function 或 RegExp 這些就不能用這種方法了。
Object.assign()複製
當物件中只有一級屬性,沒有二級屬性的時候,此方法為深複製,但是物件中有物件的時候,此方法,在二級屬性以後就是淺複製。
透過jQuery的extend方法實現深複製
let $ = require("jquery");let obj1 = {a: 1,b: {f: {g: 1}},c: [1, 2, 3]};let obj2 = $.extend(true, {}, obj1);lodash.cloneDeep()實現深複製let _ = require("lodash");let obj1 = {a: 1,b: { f: { g: 1 } },c: [1, 2, 3]};let obj2 = _.cloneDeep(obj1);使用遞迴的方式實現深複製function _deepClone(source) {let target;if (typeof source === "object") {target = Array.isArray(source) ? [] : {}for (let key in source) {if (source.hasOwnProperty(key)) {if (typeof source[key] !== "object") {target[key] = source[key]} else {target[key] = _deepClone(source[key])}}}} else {target = source}return target}更多經典前端面試題,請到github檢視或參與討論
https://github.com/daily-interview/fe-interview