JavaScript 判斷對象中是否有某屬性的常用方法

判斷對象中是否有某屬性的常見方式總結,不同的場景要使用不同的方式。

一、點( . )或者方括號( [ ] )

  通過點或者方括號可以獲取對象的屬性值,如果對象上不存在該屬性,則會返回undefined。當然,這裏的“不存在”指的是對象自身和原型鏈上都不存在,如果原型鏈有該屬性,則會返回原型鏈上的屬性值。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

// 創建對象

let test = {name : 'lei'}

// 獲取對象的自身的屬性

test.name   //"lei"

test["name"]   //"lei"

 

// 獲取不存在的屬性

test.age    //undefined

 

// 獲取原型上的屬性

test["toString"//toString() { [native code] }

 

// 新增一個值爲undefined的屬性

test.un = undefined

 

test.un    //undefined 不能用在屬性值存在,但可能爲 undefined的場景

  所以,我們可以根據 Obj.x !== undefined 的返回值 來判斷Obj是否有x屬性。

  這種方式很簡單方便,侷限性就是:不能用在x的屬性值存在,但可能爲 undefined的場景。 in運算符可以解決這個問題

二、 in 運算符

  MDN 上對in運算符的介紹:如果指定的屬性在指定的對象或其原型鏈中,則in 運算符返回true。

?

1

2

3

4

'name' in test  //true

'un' in test    //true

'toString' in test //true

'age' in test   //false

  示例中可以看出,值爲undefined的屬性也可正常判斷。

  這種方式的侷限性就是無法區分自身和原型鏈上的屬性,在只需要判斷自身屬性是否存在時,這種方式就不適用了。這時需要hasOwnProperty()

 三、hasOwnProperty()

?

1

2

3

test.hasOwnProperty('name'//true 自身屬性

test.hasOwnProperty('age')   //false 不存在

test.hasOwnProperty('toString') //false 原型鏈上屬性

  可以看到,只有自身存在該屬性時,纔會返回true。適用於只判斷自身屬性的場景。

總結

  三種方式各有優缺點,不同的場景使用不同的方式,有時還需要結合使用,比如遍歷自身屬性的時候,就會把 for ··· in  ···和 hasOwnProperty()結合使用。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章