深入理解js物件的引用

2021-09-13 18:18:54 字數 2468 閱讀 9898

基本型別

• 空值(null)

• 未定義(undefined)

• 布林值( boolean)

• 數字(number)

• 字串(string)

• 符號(symbol,es6 中新增)

引用型別

• 物件(object)

const a = '哈哈'

const b = '哈哈'

console.log(a === b) // true

const c = {}

const d = {}

console.log(c === d) // false

註解:

1.a和b是字串,比較的是值,完全相等

2.c和d是物件,比較的是引用位址,c和d都是乙個新物件,方別指向不同的位址,所以不相等

註解:

1.a是物件,b=a是將a的引用位址賦值給b

2.a和b都指向與同乙個物件,修改這個物件,a和b都會變化

註解:

1.a是物件,b=a是將a的引用位址賦值給b

2.b = 新物件賦值給b,切斷了a和b的聯絡,分別指向於不同的物件

只操作(修改,刪除,新增)物件的屬性,不會與之前物件斷開連線(案例二)

直接操作物件本身,也就是最外層,會和之前的物件斷開連線(案例三)

陣列也是物件

let a = , w:  }

let b =

b.z = 6

b.y.x = 9

b.w =

console.log(a) // , w: }

console.log(a.y === b.y) // true

console.log(a.w === b.w) // false

console.log(a === b) // false

註解:

1.b = 中,z是基本型別直接拷貝值,y和w是物件,是引用位址的拷貝

2.y是只操作屬性,連線不會斷開,w操作了本身,生產了乙個新物件,連線斷開(參考上面的總結)

案例四理解之後應該就知道為什麼js物件有淺拷貝和深拷貝的區分了場景:目前有多個使用者,每個使用者有自己的屬性,展示並且可以修改

程式實現(例如vue)

首先我們將每乙個使用者都封裝成乙個單獨的模組(.vue),使用者初始資料存放在model裡面(vuex)

一般來說修改model裡面資料,都需要用它的mutations和actions裡面的方式,如果使用者屬性比較多,每一項都需要去定義乙個mutations或actions的話,那開發量是相當的大

利用物件的引用關係,傳過來的資料不和源物件,切斷關係,是直接可以操作源物件,元件與元件之間的通訊也可以這個實現

有利也有弊,這種操作起來很簡單,但一旦切斷他們的聯絡之後,不好維護,用這種方式需要對物件引用有深入的理解,知道什麼時候會斷開聯絡

個人建議只在這種多個相同元件中使用。

判斷兩個物件值是否相等(只是純值,不管引用位址)

深入理解 引用

引用簡介 引用就是某一變數 目標 的乙個別名,對引用的操作和對變數直接操作完全相同。引用的宣告方法 型別識別符號 引用名 目標變數名 例1 int a int ra a 定義引用ra,他是變數a的引用,即別名 說明 1 在此不是求位址運算,而是起標識作用。2 型別識別符號是指目標變數的型別。3 宣告...

深入理解C 中的物件和物件引用

有言在先 返回區域性物件和引用,就像返回區域性變數的位址一樣,非常非常危險,要避免使用 先來看乙個入門級的程式 include using namespace std class a void fun a a int main 結果為 a constructor 編譯器自動產生的拷貝建構函式得到了呼...

js深入理解 一

1if a b 兩者等價 a b alert hello word 2.給eval取別名var a 111 var b eval var c b a alert c 輸出 111 3.刪除元素 不能刪除 var語句宣告的變數 var o delete o.x alert o.x 輸出 undefin...