成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

JavaScript如何判斷對象自身為空?

開發 前端
如何判斷一個對象為空是我們在開發中經常會遇到的問題,今天我們來聊聊幾種經常使用的方法,以及在不同的場景下我們如何去使用。

前言

如何判斷一個對象為空是我們在開發中經常會遇到的問題,今天我們來聊聊幾種經常使用的方法,以及在不同的場景下我們如何去使用。

1. JSON.stringify

JSON.stringify 方法可以使對象序列化,轉為相應的 JSON 格式。

const obj = {};


console.log(JSON.stringify(obj) === '{}')  // true

缺點:如果存在 undefined、任意的函數以及 symbol 值,在序列化過程中會被忽略(出現在非數組對象的屬性值中時)或者被轉換成 null(出現在數組中時)。更多

如下示例:

const obj = {
  a: undefined,
  b: function() {},
  c: Symbol()
}


console.log(JSON.stringify(obj) === '{}')  // true

2. for in 配合 hasOwnProperty

使用 for in 對當前對象進行遍歷:

const obj = {}
Object.prototype.a = 1


function isEmptyObj(obj) {
  let flag = true
  for (let o in obj) {
    flag = false
    break
  }
  return flag
}


console.log(isEmptyObj(obj))  // false

由于 for in 在進行對象遍歷時,會遍歷對象原型上的屬性,而我們只希望得到其自身的屬性,這時可以使用 hasOwnProperty 來實現,如下:

const obj = {}
Object.prototype.a = 1


function isEmptyObj(obj) {
  let flag = true
  for (let o in obj) {
    if (obj.hasOwnProperty(o)) {
      flag = false
      break
    }
  }
  return flag
}


console.log(isEmptyObj(obj))  // true

缺點:for in 不能遍歷不可枚舉的屬性。

3. Object.keys

Object.keys 會返回對象自身可枚舉屬性組成的數組,而不會遍歷原型上的屬性。

const obj = {}
Object.prototype.a = 1


console.log(Object.keys(obj).length === 0)  // true

缺點:Object.keys 和 for in 都只能遍歷可枚舉屬性,不能遍歷不可枚舉的屬性。

我們使用 Object.defineProperty 將屬性 enumerable 設置為 false 來進行測試,示例如下:

const obj = {}
Object.defineProperty(obj, 'a', {
  value: 1,
  enumerable: false
})


console.log(obj.a)  // 1
console.log(isEmptyObj(obj))  // true
console.log(Object.keys(obj).length === 0)  // true

4. Object.getOwnPropertyNames

使用 Object.getOwnPropertyNames 可以得到對象自身的所有屬性名組成的數組(包括不可枚舉屬性)。

const obj = {}
Object.defineProperty(obj, 'a', {
  value: 1,
  enumerable: false
})


console.log(Object.getOwnPropertyNames(obj))  // [ 'a' ]

缺點:不能獲取 Symbol 值作為名稱的屬性,以上的 JSON.stringify、for in 以及 Object.keys 方法也不能獲取Symbol 值作為名稱的屬性,示例如下:

const a = Symbol()
const obj = {
  [a]: 1
}


console.log(obj)  // { [Symbol()]: 1 }
console.log(Object.getOwnPropertyNames(obj).length === 0)  // true
console.log(JSON.stringify(obj) === '{}')  // true
console.log(isEmptyObj(obj))  // true
console.log(Object.keys(obj).length === 0)  // true

5. Object.getOwnPropertyNames 結合 Object.getOwnPropertySymbols

已知 Object.getOwnPropertyNames 唯一的缺點是不能獲取 Symbol 值作為名稱的屬性,而 Object.getOwnPropertySymbols 只能獲取由 Symbol 值作為名稱的屬性,兩者相結合是不是就可以完美解決了。我們來簡單測試一下:

const a = Symbol()
const obj1 = {
  [a]: 1
}
const obj2 = {b: 2}
const obj3 = {}
Object.defineProperty(obj3, 'a', {
  value: 1,
  enumerable: false
})
const obj4 = {}


function getLength(obj) {
  return Object.getOwnPropertyNames(obj).concat(Object.getOwnPropertySymbols(obj)).length
}


console.log(getLength(obj1) === 0)  // false
console.log(getLength(obj2) === 0)  // false
console.log(getLength(obj3) === 0)  // false
console.log(getLength(obj4) === 0)  // true

經過測試,上面這種方法的確可以解決,但是比較繁瑣,那有沒有更好的方法呢?答案是有的。

6. Reflect.ownKeys

Reflect.ownKeys 方法返回一個由目標對象自身的屬性組成的數組,它的返回值等同于 Object.getOwnPropertyNames(target).concat(Object.getOwnPropertySymbols(target)),示例如下:

const a = Symbol()
const obj1 = {
  [a]: 1
}
const obj2 = {b: 2}
const obj3 = {}
Object.defineProperty(obj3, 'a', {
  value: 1,
  enumerable: false
})
const obj4 = {}


console.log(Reflect.ownKeys(obj1).length === 0)  // false
console.log(Reflect.ownKeys(obj2).length === 0)  // false
console.log(Reflect.ownKeys(obj3).length === 0)  // false
console.log(Reflect.ownKeys(obj4).length === 0)  // true

總結

判斷一個對象是否為空時,使用 Reflect.ownKeys 方法最為完美。

責任編輯:華軒 來源: web前端開發
相關推薦

2011-05-25 10:46:39

Javascript

2020-08-19 08:29:22

JavaScript 對象函數

2020-08-23 11:32:21

JavaScript開發技術

2021-06-03 10:00:47

JavaScript 前端數克隆對象

2024-10-07 12:23:03

字符串Map對象

2025-04-27 03:44:00

JavaScript代碼函數

2024-10-15 15:18:01

JavaScript開發

2024-06-12 09:52:00

2025-04-25 08:50:00

JavaScript代碼開發

2024-06-14 08:54:54

2021-03-15 08:11:40

JVM回收堆內存

2021-03-26 23:41:19

JavaScript對象開發

2010-09-25 17:27:43

2020-10-22 14:00:31

JavaScript數字變量

2020-10-22 08:06:05

JavaScrip語言類型

2025-01-09 09:14:44

2019-04-23 15:20:26

JavaScript對象前端

2021-12-21 22:58:31

云計算云安全數字化轉型

2016-08-03 17:23:47

javascripthtml前端

2022-09-12 23:53:53

JavaScript條件判斷開發
點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 国产区在线 | 精品色| 久久99久久| 国产精品亚洲一区 | 久久一区二区三区四区五区 | 在线免费观看视频你懂的 | 亚洲一区二区精品视频 | 天天看逼 | 亚洲成人动漫在线观看 | 免费欧美| 亚洲 欧美 日韩在线 | 国产一级一片免费播放 | 天天干天天插天天 | 亚洲一区二区三区在线免费观看 | 免费激情| 91观看| 日本一二区视频 | 亚洲影音 | 中文字幕精品一区 | 在线免费观看黄色av | 黑人一级黄色大片 | 欧美在线资源 | 日韩三级精品 | 国产欧美精品一区 | 精品日本中文字幕 | 亚洲欧美日韩久久久 | 欧美一区二区三区视频在线观看 | 午夜小电影 | 久久久精品 | 成人国产精品久久久 | 久久免费精品 | 天天操天天干天天爽 | 国产精彩视频在线观看 | 国产精品激情小视频 | 九色在线观看 | 精品欧美激情在线观看 | 成人午夜激情 | 福利片在线 | 91久久久久久久久久久久久 | 精品一区二区三区四区视频 | 香蕉超碰 |