ES6 JavaScript 的深複製和淺複製

2021-08-13 02:37:19 字數 840 閱讀 5888

react中,我們會遇到乙個有趣的問題,那就是物件的複製,為什麼說有趣,是因為直覺和結果差距很大。

我們看一下這個例子:

let a=;

let b=a;

a.title='淺複製';

那麼我們會獲得兩個物件,乙個a,乙個b,a的title是淺複製,b的title是深複製。

但結果真是這樣嗎?

我們console.log一下

咦,為啥嘞!!!!!!為啥兩個都是輸出"淺複製"。。。。

其實,a,b是共用同乙個位址,所以雖然看起來是兩個物件,其實就是乙個物件,a===b,這就是深複製,複製的不僅僅是資料,而且連位址一起複製過來了,相當於windows的快捷方式,表面上看起來乙個在c盤,乙個在d盤,其實都是乙個檔案。

那麼,如果我們僅僅想複製」深複製「這三個字呢?a的title和b的title要不同,我們如何來做。

let a=;

let b=;

a.title='淺複製';

console.log(a.title);

console.log(b.title);

我們再來看列印結果

這樣我們雖然複製了a的所有資料,但是a和b是不同的物件,更改任意乙個的資料,不會影響到第二個,而且b還可以對a 進行拓展,比如加了content乙個字段。

es6 javascript物件屬性的簡潔表示法

es6 允許直接寫入變數和函式,作為物件的屬性和方法。這樣的書寫更加簡潔。var foo bar var baz baz 等同於 var baz 上面 表明,es6 允許在物件之中,只寫屬性名,不寫屬性值。這時,屬性值等於屬性名所代表的變數。下面是另乙個例子。function f x,y 等同於 f...

es6 javascript物件的擴充套件運算子

目前,es7 有乙個提案,將 rest 解構賦值 擴充套件運算子 引入物件。babel 轉碼器已經支援這項功能。1 rest 解構賦值 物件的 rest 解構賦值用於從乙個物件取值,相當於將所有可遍歷的 但尚未被讀取的屬性,分配到指定的物件上面。所有的鍵和它們的值,都會拷貝到新物件上面。let x ...

es6 javascript屬性的可列舉性

物件的每個屬性都有乙個描述物件 descriptor 用來控制該屬性的行為。object.getownpropertydescriptor方法可以獲取該屬性的描述物件。let obj object.getownpropertydescriptor obj,foo 描述物件的enumerable屬性,...