首頁 web前端 前端問答 JavaScript怎麼求數組長度和元素總和

JavaScript怎麼求數組長度和元素總和

Sep 20, 2022 pm 02:11 PM
javascript js數組

JavaScript中,可利用length屬性來取得數組長度,語法「數組物件.length」;可使用reduce()或reduceRight()函數來求元素總和,語法「arr.reduce(function f (pre,curr){return pre cur})」或「arr.reduceRight(function f(pre,curr){return pre cur})」。

JavaScript怎麼求數組長度和元素總和

本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

JavaScript求數組長度

#在javascript中,可以利用陣列物件的length屬性來取得陣列長度。

每個陣列都有一個 length 屬性,該屬性傳回陣列的最大長度,即其值等於最大下標值加 1。由於數字下標必須小於 2^32-1,所以 length 屬性最大值等於 2^32-1。

範例1

下面程式碼定義了一個空數組,然後為下標等於 100 的元素賦值,則 length 屬性傳回 101。因此,length 屬性不能體現陣列元素的實際個數。

var a = [];  //声明空数组
a[100] = 2;
console.log(a.length);  //返回101
登入後複製

輸出:

101
登入後複製

length 屬性可讀可寫,是一個動態屬性。 length 屬性值也會隨陣列元素的變化而自動更新。同時,如果重設length 屬性值,也會影響數組的元素,具體說明如下:

如果length 屬性被設定了一個比當前length 值小的值,則數組會被截斷,新長度之外的元素值都會遺失。

如果 length 屬性被設定了一個比目前 length 值大的值,那麼空數組就會被加到數組末尾,使得數組增長到新指定的長度,讀取值都為 undefined。

範例2

下面程式碼示範了 length 屬性值動態變化對陣列的影響。

var a = [1,2,3];  //声明数组直接量
a.length = 5;  //增长数组长度
console.log(a[4]);  //返回undefined,说明该元素还没有被赋值
a.length = 2;  //缩短数组长度
console.log(a[2]);  //返回undefined,说明该元素的值已经丢失
登入後複製

輸出:

undefined
undefined
登入後複製

JavaScript求陣列總和

方法1:使用reduce()

reduce()    將陣列元素計算為一個值(由左至右)。    

var a = [1, 2, 3, 4, 5];
var b =a.reduce(function f(pre, curr){
	return pre + curr;
	});
console.log(b);
登入後複製

JavaScript怎麼求數組長度和元素總和

說明:

reduce() 方法可對陣列中的所有元素呼叫指定的回呼函數。此回調函數的傳回值為累積結果,且此回傳值在下一次呼叫該回呼函數時作為參數提供。具體用法如下:

array.reduce(callbackfn[, initialVaule]);
登入後複製

參數說明:

  • array:必要參數,陣列物件。

  • callbackfn:必要參數,一個接受最多四個參數的函數。對於陣列中的每個元素,recude() 方法都會呼叫 callbackfn 函數一次。

  • initialVaule:可選參數,如果指定 initialVaule,則它將用作初始值來啟動累積。第一次呼叫 callbackfn 函數會將此值作為參數而非陣列值提供。

reduce() 方法的傳回值是透過最後一次呼叫回呼函數所獲得的累積結果。

如果提供了參數initialVaule,則reduce() 方法會對數組中的每個元素呼叫一次callbackfn 函數(按升序索引順序);如果為提供initialVaule,則reduce() 方法會對從第2 個元素開始的每個元素都呼叫callbackfn 函數。

回呼函數的回傳值在下一次呼叫回呼函數時會作為 previousValue 參數提供。最後一次呼叫回呼函數所獲得的回傳值為 recude() 方法的回傳值。此方法不會為數組中缺少的元素呼叫該回調函數。

回呼函數的語法如下:

function callbackfn(previousValue, currentVaule, currentIndex, array);
登入後複製

回呼函數參數說明:

  • previousValue:透過上一次呼叫回呼函數所得到的值。如果向 reduce() 方法提供 initialValue,則在首次呼叫函數時,previousValue 為 initialValue。

  • currentVaule:目前元素陣列的值。

  • currentIndex:目前陣列元素的數字索引。

  • array:包含該元素的陣列物件。

在第一次呼叫回呼函數時,作為參數提供的值取決於 reduce() 方法是否有 initialValue 參數。如果提供 recude() 方法 initialValue,則 previousValue 參數為 initialValue,currentValue 參數是數組中第 1 個元素的值。

方法2:使用reduceRight()

reduceRight()    將陣列元素計算為一個值(由右至左)。  

var arr = [1, 2, 3, 4, 5, 5];
var b =arr.reduceRight(function f(pre, curr){
	return pre + curr;
	});
console.log(b);
登入後複製

JavaScript怎麼求數組長度和元素總和

說明:

reduceRight() 方法可從右向左對陣列中的所有元素呼叫指定的回呼函數。此回調函數的傳回值為累積結果,且此回傳值在下一次呼叫該回呼函數時作為參數提供。具體用法如下:

array.reduceRight(callbackfn[, initialValue]);
登入後複製

该方法的语法和用法与 reduce() 方法大概相同,唯一不同的是,它是从数组右侧开始调用回调函数。如果提供了 initialValue,则 reduceRight() 方法会按降序索引顺序对数组中的每个元素调用一次 callbackfn 函数。如果未提供 initialValue,则 reduceRight() 方法会按降序索引顺序对每个元素(从倒数第 2 个元素开始)调用 callbackfn 函数。

【相关推荐:javascript视频教程web前端开发

以上是JavaScript怎麼求數組長度和元素總和的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1655
14
CakePHP 教程
1413
52
Laravel 教程
1306
25
PHP教程
1252
29
C# 教程
1226
24
如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統引言:隨著科技的不斷發展,語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統,具備了低延遲、即時性和跨平台的特點,成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統介紹:隨著網路的普及和技術的進步,越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統,我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議,可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中,當使用者選擇菜餚並下訂單

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代,越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統,並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工

JavaScript與WebSocket:打造高效率的即時天氣預報系統 JavaScript與WebSocket:打造高效率的即時天氣預報系統 Dec 17, 2023 pm 05:13 PM

JavaScript和WebSocket:打造高效的即時天氣預報系統引言:如今,天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展,我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中,我們將學習如何使用JavaScript和WebSocket技術,來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We

簡易JavaScript教學:取得HTTP狀態碼的方法 簡易JavaScript教學:取得HTTP狀態碼的方法 Jan 05, 2024 pm 06:08 PM

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

javascript如何使用insertBefore javascript如何使用insertBefore Nov 24, 2023 am 11:56 AM

用法:在JavaScript中,insertBefore()方法用於在DOM樹中插入一個新的節點。這個方法需要兩個參數:要插入的新節點和參考節點(即新節點將要插入的位置的節點)。

如何在JavaScript中取得HTTP狀態碼的簡單方法 如何在JavaScript中取得HTTP狀態碼的簡單方法 Jan 05, 2024 pm 01:37 PM

JavaScript中的HTTP狀態碼取得方法簡介:在進行前端開發中,我們常常需要處理與後端介面的交互,而HTTP狀態碼就是其中非常重要的一部分。了解並取得HTTP狀態碼有助於我們更好地處理介面傳回的資料。本文將介紹使用JavaScript取得HTTP狀態碼的方法,並提供具體程式碼範例。一、什麼是HTTP狀態碼HTTP狀態碼是指當瀏覽器向伺服器發起請求時,服務

See all articles