[javascript] Array function 정리 (ES6)

Array arr 변수 sample

arr: [
  {
    rspC: '0000',
    rspMsg: '정상',
    thmCardUAm: 290000,
    isCallOnlyFirstEnty: true,
  },
  { ... },
  ...  
],

Array.find

• 조건을 만족하는 단 하나의 요소만 반환

// rspC 가 '0000' 인 object 요소를 찾아 rspMsg 정상 변경
this.arr.find(item => item?.rspC === '0000').rspMsg = '정상';

Array.reduce

• 이전 callback의 previous value를 넘겨받아 작업 수행

// 합계 구하기
this.arr.reduce((total, item) => total + item?.thmCardUAm, 0);

Array.filter

• 조건을 만족하는 요소만 담은 배열 반환

// 조건에 맞는 요소 filtering 반환
this.arr.filter(item => item.isCallOnlyFirstEnty);

Array.map

• 다른 구성의 새로운 배열 반환

// 조건 또는 로직에 맞는 array 신규 생성 반환
const src = [2, 4, 6];
const des = src.map(item => item * 2); // 4, 8, 16

Array.from

• 문자열을 문자로 나누기

// 문자열 쪼개기
Array.from('test') // ['t', 'e', 's', 't']

Array.of

• 배열 형태로 반환

// 배열 생성
Array.of(1, 2, 4, 8) // [1, 2, 4, 8]

Array.findIndex

• 조건에 맞는 첫번째 요소의 index 반환

// 조건에 맞는 첫번째 배열 index 반환 (else return -1)
const src = Array.of(1, 2, 4, 8, 101);
src.findIndex(item => item > 1) // 1
src.findIndex(item => item > 100) // 4
src.findIndex(item => item > 200) // -1

Array.entries

• index와 value를 매핑한 배열 반환

// iterator object 반환
const src = ["swim", "yoga", "soccer"];
const iterObj = src.entries();
for (item of iterObj) {
	console.log(item); 
}
----------------
[ 0, 'swim' ]
[ 1, 'yoga' ]
[ 2, 'soccer' ]
----------------

Array.keys

• index 반환

// entries key 반환
const keys = src.keys();
console.log(...keys);
----------------
0 1 2
----------------

Array.values

• value 반환

// entries value 반환
const values = src.values();
console.log(...values);
----------------
swim yoga soccer
----------------

[참고]

• ES6 배열 총정리