hello world
map, reduce 자바스크립트 누적합 구하기 본문
728x90
통계화면 개발중 하위부서의누적합을 구현하는것이 필요했다.
mysql에서 recursive 기능을 제공하지않는 버전을 사용하고 있었기에
자바스크립트에서 map, reduce 메서드를 통해
통계 누적합을 구함
참고코드
<script>
var dataList = [
{
used : 0,
division : "1",
parent : "",
name: "FC채널"
}, {
used : 0,
division : "1.1",
parent : "1",
name: " 강남사업본부"
}, {
used : 41503,
division : "1.1.1",
parent : "1.1",
name: " 강남BM105지점"
}, {
used : 136684,
division : "1.1.2",
parent : "1.1",
name: " 강남BM108지점"
}, {
used : 32166,
division : "1.1.3",
parent : "1.1",
name: " 강남BM109지점"
}, {
used: 64842,
division: "1.1.4",
parent : "1.1",
name: " 강남BM110지점"
}, {
used: 45869,
division: "1.1.5",
parent : "1.1",
name: " 강남FC영업지점"
}, {
used: 1,
division: "1.2",
parent : "1",
name: " 강남대치사업본부"
}, {
used: 37606,
division: "1.2.1",
parent : "1.2",
name: " 강남대치BM100지점"
}
]
// Update one division, children first
var _update_service_sums = function(division, dataList) {
var children = dataList.filter(s => s.parent === division.division)
children.forEach(c => _update_service_sums(c, dataList))
division.used_sum = division.used + children.map(c => c.used_sum).reduce((a, b) => a + b, 0);
}
// Update all dataList
var update_service_sums = function(dataList) {
var roots = dataList.filter(s => s.parent === undefined || s.parent === '')
roots.forEach(r => _update_service_sums(r, dataList))
}
update_service_sums(dataList)
console.log(dataList)
</script>
map 메서드
- map 메서드는 다음과 같이 사용함
배열.map((요소, 인덱스, 배열) => {return 요소});
- map은 반복문을 돌면서 배열 안의 요소들을 1대1로 짝지어줌 (매핑한다고 표현)
const hello = [1, 2, 3];
let result = hello.map((v) => {
console.log(v);
return v;
});
hello; // [1, 2, 3]
result; // [1, 2, 3]
const number = [1,2,3,4]
const mapnum = number.map(val=>val*2)
console.log(mapnum);
//[2,4,6,8]
reduce 메서드
- reduce 메서드는 다음과 같이 사용함
이전값이 아니라 누적값!(초기값이 없으면 자동으로 0번째 인덱스의 값이됨)
배열.reduce((누적값,현잿값, 인덱스,요소) => {return 결과}, 초깃값);
result = oneTwoThree.reduce((acc, cur, i) => {
console.log(acc, cur, i);
return acc + cur;
}, 0);
// 0 1 0
// 1 2 1
// 3 3 2
result; // 6
< 구현한 코드 >
this.sumData = function(){
// url 호출해서 response값 받아오는 로직 생략
var updateServiceSumData = new Array();
updateServiceSumData = this.update_service_sums(response);
gridData = this.update_service_sums(response);
}
// 누적 합계 계산
this.update_service_sums = function(dataList) {
if(dataList!=null){
var roots = dataList.filter(s => s.parent === '1')
roots.forEach(r => this._update_service_sums(r, dataList))
}
return dataList;
}
// 누적 합계 계산
this._update_service_sums =function(r, dataList){
var children = dataList.filter(s => s.parDivnCd === r.divnCd)
children.forEach(c => this._update_service_sums(c, dataList))
r.aAmtSum = r.aAmt + children.map(c => parseInt(c.aAmtSum)).reduce((a, b) => a + b, 0);
}
'WEB > Front' 카테고리의 다른 글
타임리프(Thymeleaf ) 문법 정리 (1) | 2022.12.09 |
---|---|
[자바스크립트, 자바] 특정 문자열 포함 확인 함수 (0) | 2020.04.28 |
[자바스크립트, 자바] 현재 url 주소 가져오기 (0) | 2020.04.28 |
$(document).off() , $(document).on() 사용 (0) | 2020.04.23 |
제이쿼리 함수 정리 (0) | 2020.03.17 |
Comments