JavaScript Array filter()

filter() 메소드는 함수로 제공된 테스트를 통과한 요소들의 새로운 배열을 생성합니다.
filter() 메소드는 비어있는 요소들에 대해 함수를 실행하지 않습니다.
filter() 메소드는 원본 배열을 변경하지 않습니다.

arr.filter(callback(element[, index[, array]])[, thisArg]);    // from mdn web docs Array.prototype.filter()
 
array.filter(function(currentValue, index, arr), thisValue);    // from w3schools JS Array filter()     

하기 코드에서 화살표 함수로 변환 과정을 확인

const ages = [32, 33, 16, 40];
 
const filtered = ages.filter(function(age){return age >= 18;});
console.log(filtered);                  // [ 32, 33, 40 ]
console.log(typeof filtered);           // object
console.log(Array.isArray(filtered));   // true
 
const filtered2 = ages.filter((age) => {return age >=18;});
console.log(filtered2);     // [ 32, 33, 40 ]
 
const filtered3 = ages.filter((age) => age >= 18);
console.log(filtered3);     // [ 32, 33, 40 ]
 
const filtered4 = ages.filter(age => age >= 18);
console.log(filtered4);     // [ 32, 33, 40 ]

Apps chart.js사용 시 업무 분류별 등록된 업무 프로세스의 개수 구하기

let devCount = '0';
let cmmnCount = '0';
let mntnCount = '0';
let projCount = '0';
let cmpyCount = '0';
 
for (let k = 0; k < data.checklistVO.length; k++) {
 
    if(data.checklistVO[k].checklistCat === '2') {
        devCount++;
    }
 
    if(data.checklistVO[k].checklistCat === '3') {
        cmmnCount++;
    }
 
    if(data.checklistVO[k].checklistCat === '4') {
        mntnCount++;
    }
 
    if(data.checklistVO[k].checklistCat === '5') {
        projCount++;
    }
 
    if(data.checklistVO[k].checklistCat === '6') {
        cmpyCount++;
    }
}	

let checklistObj = data.checklistVO;
 
let devCount = '0';
let cmmnCount = '0';
let mntnCount = '0';
let projCount = '0';
let cmpyCount = '0';
 
for (let k = 0; k < checklistObj.length; k++) {
 
    if(checklistObj[k]['checklistCat'] === '2') {
        devCount++;
    }
    if(checklistObj[k]['checklistCat'] === '3') {
        cmmnCount++;
    }
    if(checklistObj[k]['checklistCat'] === '4') {
        mntnCount++;
    }
    if(checklistObj[k]['checklistCat'] === '5') {
        projCount++;
    }
    if(checklistObj[k]['checklistCat'] === '6') {
        cmpyCount++;
    }
}

let checklistObj = data.checklistVO;
 
let devCount = '0';
let cmmnCount = '0';
let mntnCount = '0';
let projCount = '0';
let cmpyCount = '0';
 
// checklistObj 배열에서 checklistCat === 2 인 요소들의 배열을 신규 생성해서 해당 배열의 길이 값을 변수 devCount에 대입
devCount = (checklistObj.filter(item => item['checklistCat'] === '2')).length;
cmmnCount = (checklistObj.filter(item => item['checklistCat'] === '3')).length;
mntnCount = (checklistObj.filter(item => item['checklistCat'] === '4')).length;
projCount = (checklistObj.filter(item => item['checklistCat'] === '5')).length;
cmpyCount = (checklistObj.filter(item => item['checklistCat'] === '6')).length;

[JavaScript]배열에서 특정 값의 개수
Array.prototype.filter()
JavaScript Array filter()