淺談Array --JavaScript內置對象

来源:https://www.cnblogs.com/waterrec/archive/2023/03/29/17266687.html
-Advertisement-
Play Games

Array --JavaScript內置對象 描述 可以用一個變數存儲多種數據類型的Array對象,Array不是關聯數組,不能使用字元串作為索引訪問數組元素,需要使用非負整數的下標訪問數組中的元素。 和對象的某些特征很相似,例如:屬性訪問器一半相似,衍生出的使用 .call() 或者 .apply ...


Array --JavaScript內置對象

描述

可以用一個變數存儲多種數據類型的Array對象,Array不是關聯數組,不能使用字元串作為索引訪問數組元素,需要使用非負整數的下標訪問數組中的元素。

和對象的某些特征很相似,例如:屬性訪問器一半相似,衍生出的使用 .call() 或者 .apply() 將數組方法賦予對象。

較為常用的幾個方法

有的是通過改變原數組,又或是返回一個新數組的形式。方便記憶可以劃分為:增刪改查,排序,遍歷,數據和數據集功能。

陳舊的:

此區域為增刪區域

\1. push() - 在數組末尾添加一個或多個元素,並返回新的長度。

\2. pop() - 刪除並返回數組的最後一個元素。

\3. shift() - 刪除並返回數組的第一個元素。

\4. unshift() - 在數組的開頭添加一個或多個元素,並返回新的長度。

此區域為修改區域(合併)

\5. splice() - 通過刪除或替換現有元素或者原地添加新的元素來修改數組,並以數組形式返回被修改的內容。

\6. slice() - 返回一個新的數組對象,這一對象是一個由 begin 和 end 決定的原數組的淺拷貝。

\7. concat() - 返回一個由當前數組和其它若幹個數組或者若幹個非數組值組合而成的新數組。

\8. join() - 將數組(或一個類數組對象)的所有元素連接成一個字元串並返回這個字元串。

此區域為排序查找

\9. reverse() - 顛倒數組中元素的順序。

\10. sort() - 對數組的元素進行排序。

\11. indexOf() - 返回在數組中可以找到一個給定元素的第一個索引,如果不存在,則返回-1。

\12. lastIndexOf() - 返回一個指定的元素在數組中最後出現的位置,如果不存在,則返回-1。

此區域為遍歷

\13. forEach() - 對數組的每個元素執行一次提供的函數。

\14. map() - 創建一個新數組,其結果是該數組中的每個元素都調用一個提供的函數後返回的結果。

\15. filter() - 創建一個新數組, 其包含通過所提供函數實現的測試的所有元素。

\16. reduce() - 對數組中的所有元素執行一個由您提供的reducer函數(升序執行),將其結果彙總

新穎的:

此區域為數據和數據集功能

at() - 通過下標訪問數組元素,區別於直接用方括弧訪問,可以使用負數訪問。

flat() - 將數組扁平化,深度為1。通過傳遞一個數字參數修改深度。

flatMap() - flat() 和 map() 的結合,先扁平(深度1)再遍歷。

Array.from() - 類似數組或可迭代對象創建一個新的,淺拷貝的數組實例。例如字元串,map和set

Array.of() - 創建一個數組,區別於直接使用 Array() 創建數組,括弧內的內容是數組的實際數據。假如你想創建一個長度為7的數組應該使用 Array(7) 而不是 Array.of(7) ,因為後者會創建一個[7]的數組。

entries() - 返回一個Array迭代器對象。

Array.length

array.length 改變length屬性會發生的情況,假如length小於數組最大的下標,會將length之後的元素清除。

數組的長度跟許多方法是掛鉤的,例如 entries() 方法,會通過獲取數組長度訪問每個整數索引。可以簡單的通過 .call() 方法驗證:

const arrayLike = {
  length: 3,
  0: "a",
  1: "b",
  2: "c",
};
for (const entry of Array.prototype.entries.call(arrayLike)) {
  console.log(entry);
}
// [ 0, 'a' ]
// [ 1, 'b' ]
// [ 2, 'c' ]

可以以此倆想到樓下的通用數組方法訪問 length 屬性和索引訪問數組元素。

空槽和數組方法

可以使用 Array(n) 創建一個長度為n的空槽數組。

對於空槽而言,許多數組方法都會照顧一下。例如 concat() 方法就會將空槽省去。亦或是將空槽視為 undefined 例如你能想到的 values()

數組遍歷

forEach()for...in 兩者在特殊情況下的不同效果

for...in可能會迭代對象的原型鏈上的屬性,而array.forEach不會迭代數組的原型鏈上的屬性。此外,array.forEach可以使用break和continue語句來控制迭代。而for...in不能。

const arr1 = [1, 2, 3];
arr1.name = "shit"


arr1.forEach((i) => {
  console.log(i);
}); // 1, 2, 3

for (const i in arr1) {
  console.log(arr1[i]);
}; // 1, 2, 3, shit

數組複製

深拷貝,淺拷貝 主要比較對象的引用是否一致。例如對象和數組這類數據類型可以想象成保存的是指向數據的地址,淺拷貝的本質是兩個數組或者對象中的數據指向了同一個目標。而深拷貝則是兩個完全不同的數據指向

自帶的一個淺拷貝 slice()

簡單的完成一個深拷貝可以使用 JSON 提供的 stringifyparse 方法,通過轉成 JSON 對象再轉回數組的方式。

通用數組方法

指數組的不訪問數組對象的任何內部數據,只訪問 length 屬性和索引訪問數組元素。可以使用call方法在類數組對象上調用。

const arrayLike = {
  0: "a",
  1: "b",
  length: 2,
};
console.log(Array.prototype.join.call(arrayLike, "+")); // 'a+b'

由此來看,數組和對象的相似性還是蠻大的,又或者是較簡單的數據形式,提供的簡單方法能夠讓開發者更便捷的對數據集進行操作。


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 摘要:智能把控大數據量查詢,防患系統奔潰於未然。 本文分享自華為雲社區《拒絕“爆雷”!GaussDB(for MySQL)新上線了這個功能》,作者:GaussDB 資料庫。 什麼是最大讀取行 一直以來,大數據量查詢是資料庫DBA們調優的重點,DBA們通常十八般武藝輪番上陣以期提升大數據查詢的性能:例 ...
  • 從MySQL 5.5版本開始預設 使用InnoDB作為引擎,它擅長處理事務,具有自動崩潰恢復的特性,在日常開發中使用非常廣泛 下麵是官方的InnoDB引擎架構圖,主要分為記憶體結構和磁碟結構兩大部分。 InnoDB 記憶體結構 1. Buffer Pool Buffer Pool:緩衝池,簡稱BP。其作 ...
  • 日常生產中 HDFS 上小文件產生是一個很正常的事情,同時小文件也是 Hadoop 集群運維中的常見挑戰,尤其對於大規模運行的集群來說可謂至關重要。 數據地圖是離線開發產品的基本使用單位,包含全部表和項目的相關信息,可以對錶做相關的許可權管理和脫敏管理操作,以及可以展示對應項目占用情況和其表的占用情況 ...
  • GreatSQL社區原創內容未經授權不得隨意使用,轉載請聯繫小編並註明來源。 GreatSQL是MySQL的國產分支版本,使用上與MySQL一致。 作者: 奧特曼愛小怪獸 文章來源:GreatSQL社區原創 前言 線上,遇到一些sql性能問題,需要手術刀級別的調優。optimizer_trace是一 ...
  • 華為HMS Core運動健康服務支持通過REST API,以GPX文件格式寫入用戶路線數據,支持導入軌跡(Track)或路程(Route)類型的數據,實現用戶路線數據在華為運動健康App中的展示效果。 假若與華為運動健康App相連接的穿戴設備支持路線導入,那麼用戶路線數據將自動下發至穿戴設備。用戶可 ...
  • 這裡給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 假設,我們有這樣一張 Gif 圖: 利用 CSS,我們嘗試來搞一些事情。 圖片的 Glitch Art 風 在這篇文章中 --CSS 故障藝術,我們介紹了利用混合模式製作一種暈眩感覺的視覺效果。有點類似於抖音的 LOGO。 像是這樣: 假 ...
  • 本博文介紹CSS中的基礎選擇器和複合選擇器。基礎選擇器包括標簽選擇器、類選擇器、id選擇器和通配符選擇器,複合選擇器包括後代選擇器、子選擇器、並集選擇器和偽類選擇器。 ...
  • 在上篇隨筆《基於Admin.NET框架的前端的一些改進和代碼生成處理(1)》中大致介紹了一些關於對Admin.NET框架的前端的改造工作,主要目的就是希望能夠增加代碼的簡潔和可讀性,以及利用代碼生成工具來快速生成相關的代碼,從而減少開發過程中的繁瑣問題。本篇隨筆繼續探討一下,對其中一些模塊功能進行一... ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...