JavaScript 獲取對象長度

来源:https://www.cnblogs.com/yuzhihui/archive/2023/01/12/17045945.html
-Advertisement-
Play Games

JavaScript 中,對於普通對象,不能直接使用 length 來獲取對象的長度,因為 JavaScript 對象並不是一種有序的集合,沒有長度的概念。 對於數組或者類數組對象,可以使用 .length 來獲取它們的長度,因為它們是有序集合。 對於字元串也可以使用.length來獲取長度,因為字... ...


JavaScript 中,對於普通對象,不能直接使用 length 來獲取對象的長度,因為 JavaScript 對象並不是一種有序的集合,沒有長度的概念。

對於數組或者類數組對象,可以使用 .length 來獲取它們的長度,因為它們是有序集合。

對於字元串也可以使用.length來獲取長度,因為字元串也是有序集合。

 

使用 Object.keys() 方法來獲取對象的可枚舉自有屬性的鍵的數組,並使用數組的 length 屬性來獲取對象的長度。例如:

let obj = {name: 'John', age: 30, city: 'New York'};
let length = Object.keys(obj).length;
console.log(length); //3

也可以使用 for...in 來遍歷對象中的所有鍵,併在遍歷過程中計數。例如:

let obj = {name: 'John', age: 30, city: 'New York'};
let count = 0;
for (let key in obj) {
  if (obj.hasOwnProperty(key)) {
    count++;
  }
}
console.log(count); // 3

對於對象來說有一點需要註意,如果對象沒有定義任何自有屬性,或者對象是一個繼承來的對象,它可能會包含一些繼承來的屬性。而 hasOwnProperty 方法只會檢查自有屬性,所以在使用 for...in 時應該使用 hasOwnProperty 來確保只遍歷了對象的自有屬性。

對於 ES6 的 Object.keys(obj) 和 Object.values(obj) 是在遍歷的同時會忽略繼承的屬性,所以可以不用 hasOwnProperty。

使用 Object.getOwnPropertyNames(obj).length ,這個方法會返回一個數組,裡面是對象所有的鍵名,然後可以使用length來獲取長度。

let obj = {name: 'John', age: 30, city: 'New York'};
let length = Object.getOwnPropertyNames(obj).length;
console.log(length); // 3

使用 Object.getOwnPropertyNames 與 Object.keys 不同在於,它包括對象的不可枚舉屬性(除了 Symbol 屬性),如果想要判斷對象自身的屬性,最好使用Object.keys,如果需要包括不可枚舉屬性,那就使用Object.getOwnPropertyNames

總結:

  • 使用 Object.keys(obj).length 可以獲取對象的可枚舉自有屬性長度
  • 使用 Object.getOwnPropertyNames(obj).length 可以獲取對象的所有自有屬性長度,包括不可枚舉屬性
  • 使用 for...in 迴圈遍歷對象的屬性並計數的方法來獲取對象的長度,可通過該方法獲取所有屬性的長度(包括繼承來的屬性

需要註意的是,這些方法是在 ES5 標準之後提出的,在老的瀏覽器中可能不支持。

作者:yuzhihui
出處:http://www.cnblogs.com/yuzhihui/ 聲明:歡迎任何形式的轉載,但請務必註明出處!!!
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • JavaScript 面向切麵編程 (AOP) 是一種編程思想和實現方式,它將一些關註點(例如日誌記錄、安全性檢查、性能監控等)從主題對象中分離出來,通過“橫切關註點”的方式在程式中動態地織入這些關註點。這樣可以避免在主題對象中嵌入大量的關註點代碼,使得代碼更加簡潔和可維護。 ...
  • CSS Grid 佈局是一種二維佈局方式,可以將頁面分成行和列,併在其中放置元素。使用 Grid 佈局時,需要定義網格容器和網格項目。 ...
  • Axios 1.基本說明 Axios是一個基於promise的網路請求庫,作用於node.js和瀏覽器中。它是 isomorphic 的 (即同一套代碼可以運行在瀏覽器和node.js中)。在服務端它使用原生node.js http 模塊, 而在客戶端 (瀏覽端) 則使用XMLHttpRequest ...
  • JavaScript 是一種基於原型繼承的語言。在 JavaScript 中,對象是通過原型鏈來繼承屬性和方法的。 一、原型 每一個對象都有一個 proto 屬性,該屬性指向該對象的原型。原型本質上也是一個對象,所有的對象都擁有一個原型,除了 Object.prototype。 JavaScript ...
  • 著意登樓瞻玉兔,何人張幕遮銀闕?又到了一年一度的網頁小掛件環節,以往我們都是集成別人開源的組件,但所謂熟讀唐詩三百首,不會做詩也會吟,熟讀了別人的東西,做幾首打油詩也是可以的,但若不能自出機抒,卻也成不了大事,所以本次我們從零開始製作屬於自己的網頁小掛件,博君一曬。 玉兔主題元素繪製 成本最低的繪製 ...
  • 這裡給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 一、audio標簽的使用 1、Audio 對象屬性 2、對象方法 二、效果 效果如下: 三、代碼 代碼如下: MusicPlayer.vue <template> <div class="music"> <!-- 占位 --> <div ...
  • 摘要:輸入網址並點回車,後臺到底發生了什麼。透析 HTTP 協議與 TCP 連接之間的千絲萬縷的關係。掌握為何是三次握手四次揮手?time_wait 存在的意義是什麼?全面圖解重點問題,再也不用擔心面試問這個問題。 本文分享自華為雲社區《輸入網址,小手一點,後面到底發生了什麼?》,作者:龍哥手記。 ...
  • 1.按鈕點擊後添加loading,介面返回成功後再移除loading(經過多次嘗試發現,此方法不能完全確保只調用一次介面,第二次添加時仍會多次調用介面),方法如下: html代碼: <el-button @click="onSave" :loading="onLoading">保存</el-butt ...
一周排行
    -Advertisement-
    Play Games
  • 隨著Aspire發佈preview5的發佈,Microsoft.Extensions.ServiceDiscovery隨之更新, 服務註冊發現這個屬於老掉牙的話題解決什麼問題就不贅述了,這裡主要講講Microsoft.Extensions.ServiceDiscovery(preview5)以及如何 ...
  • 概述:通過使用`SemaphoreSlim`,可以簡單而有效地限制非同步HTTP請求的併發量,確保在任何給定時間內不超過20個網頁同時下載。`ParallelOptions`不適用於非同步操作,但可考慮使用`Parallel.ForEach`,儘管在非同步場景中謹慎使用。 對於併發非同步 I/O 操作的數量 ...
  • 1.Linux上安裝Docken 伺服器系統版本以及內核版本:cat /etc/redhat-release 查看伺服器內核版本:uname -r 安裝依賴包:yum install -y yum-utils device-mapper-persistent-data lvm2 設置阿裡雲鏡像源:y ...
  • 概述:WPF界面綁定和渲染大量數據可能導致性能問題。通過啟用UI虛擬化、非同步載入和數據分頁,可以有效提高界面響應性能。以下是簡單示例演示這些優化方法。 在WPF中,當你嘗試綁定和渲染大量的數據項時,性能問題可能出現。以下是一些可能導致性能慢的原因以及優化方法: UI 虛擬化: WPF提供了虛擬化技術 ...
  • 引言 上一章節介紹了 TDD 的三大法則,今天我們講一下在單元測試中模擬對象的使用。 Fake Fake - Fake 是一個通用術語,可用於描述 stub或 mock 對象。 它是 stub 還是 mock 取決於使用它的上下文。 也就是說,Fake 可以是 stub 或 mock Mock - ...
  • 為.net6在CentOS7上面做準備,先在vmware虛擬機安裝CentOS 7.9 新建CentOS764位的系統 因為CentOS8不更新了,所以安裝7;簡單就一筆帶過了 選擇下載好的操作系統的iso文件,下載地址https://mirrors.aliyun.com/centos/7.9.20 ...
  • 經過前面幾篇的學習,我們瞭解到指令的大概分類,如:參數載入指令,該載入指令以 Ld 開頭,將參數載入到棧中,以便於後續執行操作命令。參數存儲指令,其指令以 St 開頭,將棧中的數據,存儲到指定的變數中,以方便後續使用。創建實例指令,其指令以 New 開頭,用於在運行時動態生成並初始化對象。方法調用指... ...
  • LiteDB 是一個輕量級的嵌入式 NoSQL 資料庫,其設計理念與 MongoDB 類似,但它是完全使用 C# 開發的,因此與 C# 應用程式的集成非常順暢。與 SQLite 相比,LiteDB 提供了 NoSQL(即鍵值對)的數據存儲方式,並且是一個開源且免費的項目。它適用於桌面、移動以及 We ...
  • 1 開源解析和拆分文檔 第三方的工具去對文件解析拆分,去將我們的文件內容給提取出來,並將我們的文檔內容去拆分成一個小的chunk。常見的PDF word mark down, JSON、HTML。都可以有很好的一些模塊去把這些文件去進行一個東西去提取。 優勢 支持豐富的文檔類型 每種文檔多樣化選擇 ...
  • OOM是什麼?英文全稱為 OutOfMemoryError(記憶體溢出錯誤)。當程式發生OOM時,如何去定位導致異常的代碼還是挺麻煩的。 要檢查OOM發生的原因,首先需要瞭解各種OOM情況下會報的異常信息。這樣能縮小排查範圍,再結合異常堆棧、heapDump文件、JVM分析工具和業務代碼來判斷具體是哪 ...