JS實(shí)現(xiàn)數(shù)組內(nèi)值累加常見的3個(gè)方法
怎么實(shí)現(xiàn)數(shù)組的每一個(gè)值進(jìn)行累加呢?我只想到了三種方法,比較基礎(chǔ),也比較常用的,如果還有其他方法可以傳授一下給我,謝謝!
一、方法一:(使用for循環(huán))
// 1.定義一個(gè)數(shù)組 var oldArray = [1,2,3,4,5,6,7]; // 2.定義一個(gè)初始值 0 let result = 0; // 2.for循環(huán)遍歷,累加 for(let i = 0; i<oldArray.length;i++){ result += oldArray[i] } console.log(result,'result') //28 result
二、方法二:(使用reduce方法)
// 1.定義一個(gè)數(shù)組 var oldArray = [1,2,3,4,5,6,7]; // 2.定義一個(gè)新的變量接收值 let result = oldArray.reduce((a,b)=>{ return a + b; }) // 3.打印 console.log(result,'result') // 28 result
三、方法三:(使用forEach方法)
// 1.定義一個(gè)數(shù)組 var oldArray = [1,2,3,4,5,6,7]; // 2.定義一個(gè)變量 let result = 0; // 3.使用forEach()循環(huán)遍歷和方法一類似 oldArray.forEach((item)=>{ result += item }) // // 3.打印 console.log(result,'result')
以上是我想到的比較常用且實(shí)用的方法!
附:js實(shí)現(xiàn)對(duì)象數(shù)組去重及數(shù)據(jù)疊加
HTML
<template> <div> <div v-for="item in list"> id:{{item.id}} - count:{{item.count}} </div> <br /> <div>點(diǎn)擊按鈕去重,count疊加</div> <button @click="getData">去重</button> </div> </template>
JavaScript
<script> export default { name: 'app', data(){ return { list: [ { id: 0, count: 2, }, { id: 1, count: 2, }, { id: 2, count: 2, }, { id: 3, count: 2, }, { id: 0, count: 2, }, { id: 2, count: 2, }, ] } }, methods: { getData(){ let listFilter = this.list // 定義map方法 const res = new Map(); // 過(guò)濾器過(guò)濾listFilter this.list = listFilter.filter((item) => { // res收集第一次存在的元素,如果存在,查看存在的位置,對(duì)list中的count進(jìn)行疊加 if(res.has(item.id)){ for(let [key,value] of res){ if(key==item.id){ this.list[key].count += item.count } } } // 如果不存在,則添加到res中 return !res.has(item.id) && res.set(item.id, 1) }); } } } </script>
總結(jié)
到此這篇關(guān)于JS實(shí)現(xiàn)數(shù)組內(nèi)值累加常見的3個(gè)方法的文章就介紹到這了,更多相關(guān)JS數(shù)組內(nèi)值累加內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
編寫一個(gè)javascript元循環(huán)求值器的方法
這篇文章主要介紹了編寫一個(gè)javascript元循環(huán)求值器的方法,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04微信小程序網(wǎng)絡(luò)請(qǐng)求封裝示例
這篇文章主要介紹了微信小程序網(wǎng)絡(luò)請(qǐng)求封裝示例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-07-07JavaScript對(duì)象合并實(shí)現(xiàn)步驟介紹
這篇文章主要介紹了JavaScript對(duì)象合并實(shí)現(xiàn)步驟,為什么要合并?這是我在重構(gòu)代碼的時(shí)候的一個(gè)需求。簡(jiǎn)單來(lái)說(shuō),我會(huì)有若干個(gè)對(duì)象需要合并為一個(gè)對(duì)象。而這些對(duì)象為兩層,如果直接展開或者賦值會(huì)涉及到深拷貝2023-01-01基于KO+BootStrap+MVC實(shí)現(xiàn)的分頁(yè)控件代碼分享
本段js和html兩段代碼實(shí)現(xiàn)分頁(yè)控件效果,下面通過(guò)本文給大家詳細(xì)介紹下基于KO+BootStrap+MVC實(shí)現(xiàn)的分頁(yè)控件,非常不錯(cuò),感興趣的朋友一起看看吧2016-11-11封裝一個(gè)公用Echarts圖表組件的3種模板代碼示例
這篇文章主要給大家介紹了關(guān)于封裝一個(gè)公用Echarts圖表組件的3種模板,定義圖表公共樣式是為了統(tǒng)一同一網(wǎng)站各頁(yè)面圖表的基礎(chǔ)樣式,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02JS排序算法之希爾排序與快速排序?qū)崿F(xiàn)方法
這篇文章主要介紹了JS排序算法之希爾排序與快速排序?qū)崿F(xiàn)方法,結(jié)合實(shí)例形式分析了希爾排序與快速排序的原理及javascript實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-12-12JavaScript 原型學(xué)習(xí)總結(jié)
每個(gè)對(duì)像都有一個(gè)隱慝的屬性用于指向到它的父對(duì)像(構(gòu)造對(duì)像的函數(shù))的原型(這里稱為父原型或隱式原型),并從中繼承它的屬性和方法2010-10-10JavaScript在網(wǎng)頁(yè)中畫圓的函數(shù)arc使用方法
這篇文章主要介紹了JavaScript在網(wǎng)頁(yè)中畫圓的函數(shù)arc使用方法的相關(guān)資料,需要的朋友可以參考下2015-11-11