Javascript數組系列一之棧與隊列

来源:https://www.cnblogs.com/beevesnoodles/archive/2018/09/10/9623924.html
-Advertisement-
Play Games

所謂數組(英語:Array),是有序的元素序列。 若將有限個類型相同的變數的集合命名,那麼這個名稱為數組名。 組成數組的各個變數稱為數組的分量,也稱為數組的元素,有時也稱為下標變數。 ---百度百科 簡單理解,數組就是數據的有序列表。 Array 在 Javascript 中屬於最常用的數據類型之一 ...


所謂數組(英語:Array),是有序的元素序列。 若將有限個類型相同的變數的集合命名,那麼這個名稱為數組名。 組成數組的各個變數稱為數組的分量,也稱為數組的元素,有時也稱為下標變數。 ---百度百科

簡單理解,數組就是數據的有序列表。

Array 在 Javascript 中屬於最常用的數據類型之一了,與其它語言一樣 Javascript 中的數組也是數據的有序列表,但是與其他語言有所不同的是,它可以用於保存任何數據類型,而且數組的長度是可以動態調整的。

var elements = ['first', 2, {age: 14}];

創建數組

既然認識了數組,那我們先看怎麼創建一個數組吧!Javascript 提供兩種創建數組的方法。

1.通過構造函數創建

var arr1 = new Array(); //[]
var arr2 = new Array(3); //[,,] 創建一個包含三項的數組
var arr3 = new Array(3, 4) //[3, 4]
var arr4 = new Array('3'); //['3']
var arr5 = new Array('2','3'); //['2','3']

看到上面的結果簡直蒙逼,因此可以看出參數傳遞的不同產生的結果也會不一樣,而且結果令人驚訝,不過我們可以總結為:如果傳入一位數值類型的參數時,則創建給一個定項的數組(例如 arr2 ),如果傳入其他類型的參數時,則會創建一個包含當前參數的數組(例如 arr4, arr5),

我們這個方法比較坑,所以一般不會使用這個方法去創建數組,那麼我們繼續看下一個方法如何創建數組的。

2.通過字面量創建

var arr1 = [];
var arr2 = [1, 2];
var arr3 = ['1', '3'];

就是這麼簡單,粗暴,明瞭;是我們創建數組最常用的方法,而且這種方法創建還非常高效。

如何訪問和設置數組

上面說到我們是如何創建一個數組,數組創建出來之後我們需要對數組中的元素進行訪問或修改吧?下麵我們就來看看吧

  • 訪問數組,通過索引訪問數組中的元素,索引從 0 開始,如果訪問的索引大於數組中元素的個數怎麼辦呢?結果肯定是找不到的,所以會返回 undefined 。

說到數組元素的個數我們不能不提到數組的一個屬性了,那就是 length 屬性,它會返回當前數組元素的個數,
而且 length 屬性不是只讀屬性,它還可以去修改,因此我們利用 length 屬性即可以添加數組的元素,還可以刪除數組的元素。

var arr = ['first', 'second', 'three'];
console.log(arr[0]); //first
console.log(arr[1]); //second
console.log(arr[3]); //undefined

//利用 length 刪除元素
arr.length = 2;
console.log(arr); //["first", "second"]

//利用 length 添加元素(可以利用此方法在數組的末尾添加元素)
arr[arr.length] = 'five';
console.log(arr); //["first", "second", "five"]

如何表現的和「棧」一樣

想要知道數組怎麼表現的和「棧」一樣,首先我們先來瞭解一下什麼是「棧」。

在這裡我們不深究「棧」,如果深究下去一時半會我們也說不清楚,也不是我們本文的重點。

簡單來說,「棧」是一種數據結構,一種 LIFO (Last-In-First-Out)的數據結構,也就是後進先出,最新添加進來的元素最早被移出。
在 「棧」中添加數據和刪除數據也被稱為推入和彈出,而且推入和彈出只會發生在「棧」的頂部。

stack 圖片stack 圖片

Javascript 提供為數組提供了兩個方法以便於我們實現「棧」的行為,下麵我們就來看看吧。

  • push : 向數組的末尾添加元素,可以傳入任意數量的參數
  • pop:從數組的末尾刪除最後一項,返回刪除的元素,使數組的 length-1
var arr = ['A', 'B', 'C'];
arr.push('D');
console.log(arr); //['A', 'B', 'C', 'D']
var rem = arr.pop();
console.log(arr);//['A', 'B', 'C']
console.log(rem); // 'D'

如何表現的和 「隊列」一樣

上回我們說到 Javascript 中的數組可以有「棧」一樣的行為,那麼它也可以表現出和「隊列」一樣的行為。

「棧」是一種 LIFO 數據結構,而「隊列」則是一種 FIFO(First In First Out)的數據結構,即先進先出。

數據在「隊列」的末尾添加元素,在前端移出元素,上面說到我們可以利用 push 方法在數組的末尾添加元素,那麼什麼方法在數組的前端去移出元素呢?答案就是 shift() 方法。

隊列隊列

  • shift:刪除數組的第一個元素,返回刪除的元素,使數組的 length-1

可以看出它與pop()方法剛好相反

var arr = ['A', 'B', 'C'];
arr.push('D');
console.log(arr); //['A', 'B', 'C', 'D']
var rem = arr.shift();
console.log(arr);//['B', 'C', 'D']
console.log(rem); // 'A'

我們可以看到上面我們是在末尾添加元素,前端刪除元素,但是我們可以不可以在前端添加元素,在末尾刪除元素呢?也就是說我們能不能反向模擬「隊列」。

Javascript 中為我們提供了一個方法然後我們配合pop()方法我們就可以實現反向的模擬。那就是 unshift()。

隊列2隊列2

  • unshift():在數組的開頭添加任意個數的元素
var arr = ['A', 'B', 'C'];
arr.unshift('D');
console.log(arr); //[ 'D', 'A', 'B', 'C']
var rem = arr.pop();
console.log(arr);//['D', 'A', 'B']
console.log(rem); // 'C'

總結

「數組」在 Javascript 中是最為常見的引用類型的數據結構,其重要性是不言而喻的,因此「數組」也擁有比較多的方法,如果一個篇幅寫下來會非常非常的長,這樣不僅不利於閱讀而且也非常考驗讀者對耐性,細水長流,所以我們分兩篇文章去介紹,如果你對文章感興趣,可以持續關註,如果喜歡呢,你也可以轉發,點贊,對作者也是一種支持!


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

-Advertisement-
Play Games
更多相關文章
  • 一、用戶與組 1.用戶與組的概念 在linux系統中,根據系統管理需要將用戶分為三種類型: 1.超級用戶:root是linux系統的超級用戶,對系統擁有絕對許可權。由於root用戶許可權太大,只有在進行系統管理、維護任務時使用root用戶,建議日常事物處理用普通用戶賬號。 2.普通用戶:普通用戶由roo ...
  • 提示:這裡的用戶指的是普通用戶 讀寫執行許可權對root無效 對於目錄來說 1)只擁有讀許可權 可以ls 查看目錄內容,不能切換進目錄中去 也不能創建目錄或文件 [support@node1 opt]$ ls log/ls: cannot access log/www: Permission denie ...
  • 原因:php 給android 寫介面出現java.net.ProtocolException:unexpected end of stream,查找android方面原因時發現數據超長 ,發現html源代碼被截斷了,原因在nginx轉發上,查詢nginx轉發日誌: 給與相關文件夾777許可權:解決 ...
  • alpha 版 內部測試版本。a 是希臘字母的第一個,表示最早的版本,一般用戶不要下載這個版本,這個版本包含很多 BUG,功能不全,主要是給開發人員和測試人員測試和找 BUG 用的。 beta版 公開測試版。b 是希臘字母的第二個,這個版本比 alpha版本發佈得晚一些,主要是給忠實用戶測試用的,改 ...
  • 1. 什麼是YUM YUM(全稱為 Yellow dog Updater Modified) 是一個在Fedora和RedHat以及CentOS中的Shell前端軟體包管理器。基於RPM包管理,能夠從指定的伺服器自動下載RPM包並且安裝,可以自動處理依賴性關係,並且一次安裝所有依賴的軟體包,無須繁瑣 ...
  • 一、問題描述 最近在做一個小程式項目,需要禁止下拉刷新,於是在page.json裡面添加了這段話 全局關閉下拉刷新,這段話確實禁止了下拉刷新,無論是安卓手機端還是蘋果端,但是在蘋果端卻出現了一個問題,整個頁面雖然不能下拉刷新了,但是依然還可以下拉。產品的需求不太允許我這麼做,能儘量禁止下拉就禁止,不 ...
  • 懶載入技術(簡稱lazyload)並不是新技術, 它是js程式員對網頁性能優化的一種方案.lazyload的核心是按需載入 涉及到圖片,falsh資源 , iframe, 網頁編輯器(類似FCK)等占用較大帶寬,且這些模塊暫且不在瀏覽器可視區內,因此可以使用lazyload在適當的時候載入該類資源. ...
  • ngrok實現內網穿透 做微信公眾號開發,這個內網穿透就是必須要整的了,內網穿透,就是把本機的服務映射到公網中去,別人在外網也可以訪問到你的本機項目 開始用的是localtunnel,然而這個太不穩定了,每次敲完lt port 80需要好久好久才有反應,而且就算好不容易埠起來了,過了一會又報那個檢 ...
一周排行
    -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.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...