[JS] CheatSheet - Array

📖 Array

🎯 Array.from() ➡︎ 배열 초기화

• ES6를 지원하는 최신 브라우저에서 사용 가능
• n * m 배열 생성

Array.from(Array(n), () => Array(m))

• 예시

const arr1 = Array.from(Array(3), () => new Array(2));
// 3 * 2 짜리 빈배열 생성

const arr2 = Array.from(Array(3), () => Array(2).fill(0));
// 0으로 채워진 3 * 2 짜리 배열 생성
// [[0, 0], [0, 0], [0, 0]]

🎯 for...of arr ➡︎ 배열 반복

• for...of 구문보다는 배열 내장함수를 더 많이 사용

const nums = [1, 2, 3]

for (let num of nums) {
  console.log(num)
}
// 1
// 2
// 3

🎯 arr.forEach()

병렬처리

• 각 항목에 대해 함수 호출

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];

arr.forEach((a, i) => {
	console.log(i, a);
});
//0 "one"
//1 "two"
//2 "three"
//...

🎯 arr.map()

• 새로운 배열 생성

const nums = [1, 2, 3, 4, 5];
const square = nums.map(num => num * num);

console.log(square)
// [1, 4, 9, 16, 25]

🎯 arr.filter()

• 조건을 충족하는 항목만 남은 새로운 배열 생성

const nums = [1, 2, 3, 4, 5];
const even = nums.filter(num => num % 2 === 0);

console.log(even)
// [2, 4]

🎯 arr.reduce()

누산기(accumulator)에 각 항목의 연산 결과가 담김

const nums = [1, 2, 3, 4, 5];
const sum = nums.reduce((acc,num) => acc += num);

console.log(sum)
// 15

누산기 초기값 설정 가능

const nums = [1, 2, 3, 4, 5];
// 초기값 100
const sum = nums.reduce((acc,num) => acc += num, 100);

console.log(sum)
// 115

return 사용

const nums = [1, 2, 3, 4, 5];
const oddnum = nums.reduce((acc,num) => {
   if (num % 2 === 1) {		
	acc.push(num)		// 홀수일 때 push
  }
  return acc			// acc를 리턴
}, []);				// 초기값 = []

console.log(oddnum)
// [1, 3, 5]

🎯 arr.reduceRight()

• reduce와 방향만 반대. 마지막 항목부터 순서대로 연산 실행

인덱스와 원본 배열을 인자로

const nums = [1, 2, 3, 4, 5];
let sum = nums.reduceRight((acc, cur, index, array) => {	// array = nums (원본 배열)
  
  console.log('index=',index, 'acc=',acc, 'cur=',cur);
  
  if (index === 0) {						// 마지막 항 도달시
    return (acc + cur) / array.length;				// 평균 계산
  }
  
  return acc + cur;						// 합 계산
  
}, 0);

console.log('sum=',sum)
// "index=" 2 "acc=" 0 "cur=" 3
// "index=" 1 "acc=" 3 "cur=" 2
// "index=" 0 "acc=" 5 "cur=" 1
// "sum=" 2

🎯 arr.entries() ➡︎ python의 enumerate

순차처리
entries()를 쓰면 내부 배열이 [인덱스, 값] 모양 이터레이터로 바뀐다

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];

for (const [i, a] of arr.entries()) {
  console.log(i, a);
}
//0 "one"
//1 "two"
//2 "three"
//...

• i는 인덱스값으로, 콘솔이나 콜백함수가 배열 요소들을 순차적으로 입력할 수 있도록 한다.

🎯 arr.slice() ➡︎ 항목 제거

새로운 배열을 반환

arr.slice(start [, end])

특정 인덱스 이후 모두

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];
console.log(arr.slice(4))
//["five", "six"]

특정 인덱스 구간 (start는 포함 end는 미포함)

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];
console.log(arr.slice(1, 3))
// ["two", "three"]

음수 인덱스

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];
console.log(arr.slice(-2))
// 끝에서 2개 전 이후 모두
// ["five", "six"]

음수 인덱스 구간 (start는 포함 end는 미포함)

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];
console.log(arr.slice(-5, -3))
// 끝에서 5개 전부터 끝에서 3개전까지
// ["two", "three"]

🎯 arr.splice() ➡︎ 항목 추출

원본 배열 자체를 수정

• splice도 slice와 음수 인덱스 똑같이 적용

arr.splice(start(, deleteCount(, element)))

특정 인덱스 이후 모조리 제거

const arr = ['one', 'two', 'three', 'four', 'five', 'six'];

//인덱스3 이후 제거
console.log(arr.splice(4))
//['five', 'six']
console.log(arr)
//['one', 'two', 'three', 'four]

특정 인덱스부터 항목 몇 개 제거

const arr = ['one', 'two', 'three', 'four];

//인덱스1부터 항목 2개 제거
console.log(arr.splice(1, 2));
//['two', 'three']
console.log(arr)
//['one', 'four']

특정 인덱스부터 몇 개 항목을 무엇으로 치환

const arr = ['one', 'four'];

//인덱스1부터 0개 항목을 'seven'으로 치환 => 그냥 추가
arr.splice(1, 0, 'seven');
console.log(arr);
//['one', 'seven', 'four']

//인덱스1부터 2개 항목을 'eight'으로 치환
console.log(arr.splice(1, 2, 'eight'));
//['seven', 'four']
console.log(arr)
//['one', 'eight']

🎯 arr.find() ➡︎ 조건 만족 항목 찾기

• 조건을 만족하는 첫 항목을 리턴
• 없으면 리턴 -1

const arr = ['one', 'two', 'three', 'four'];

console.log(arr.find(element => element.length === 4));
//'four'

🎯 arr.findIndex() ➡︎ 조건 만족 인덱스 찾기

• 조건을 만족하는 첫 항목의 index를 리턴
• 없으면 리턴 -1

const arr = ['one', 'two', 'three', 'four'];

console.log(arr.findIndex(element => element.length === 4));
//3

🎯 arr.indexOf(searchElement(, fromIndex)) ➡︎ 항목의 인덱스 찾기

arr.indexOf(searchElement(, fromIndex))

• 항목의 첫 인덱스를 리턴
• 옵션으로 fromIndex 지정 가능 => 특정 인덱스 이후부터 search
• 없으면 리턴 -1

const arr = ['one', 'four', 'two', 'three', 'four'];

console.log(arr.indexOf('four'));
//1
console.log(arr.indexOf('four', 2));		//index2 이후에서 탐색
//4

🎯 arr.pop() 🎯 arr.push() ➡︎ 마지막 항목

마지막 항목 제거

const arr = ['one', 'two', 'three', 'four'];

console.log(arr.pop())
// 'four'
console.log(arr)
// ['one', 'two', 'three']

push로 뒤에 추가

const arr = ['one', 'two', 'three', 'four'];
arr.push('five')

console.log(arr)
// ['one', 'two', 'three', 'four', 'five']

🎯 arr.shift() 🎯 arr.unshift() ➡︎ 첫 항목

shift로 첫 항목 제거

const arr = ['one', 'two', 'three', 'four'];

console.log(arr.shift())
// 'one'
console.log(arr)
// ['two', 'three', 'four']

unshift로 앞에 추가

const arr = ['one', 'two', 'three', 'four'];
arr.unshift('zero')

console.log(arr)
// ['zero', 'one', 'two', 'three', 'four']

🎯 arr.concat() 🎯 arr.join() ➡︎ 배열 합치기

원본 배열은 그대로

concat ➡︎ 배열로 합치기

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const concatenated = arr1.concat(arr2);

console.log(concatenated);
// [1, 2, 3, 4, 5, 6]

join ➡︎ 문자열로 합치기

• 각 항목 + 구분자로 이루어진 문자열
• 기본 구분자는 ,

const array = [1, 2, 3, 4, 5];

console.log(array.join());
// 1,2,3,4,5
console.log(array.join(' '));
// 1 2 3 4 5
console.log(array.join(', '));
// 1, 2, 3, 4, 5

🎯 arr.includes()

항목을 포함하는지 체크

const arr1 = [1, 2, 3];

console.log(arr1.includes(2))
//true

🎯 arr.reverse()

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
console.log(arr);
/* 
[
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
]
*/

let reversed = [...arr].reverse();
console.log(reversed);
/* 
[
  [7, 8, 9],
  [4, 5, 6],
  [1, 2, 3]
]
*/

🎯 배열 90도 회전하기

방법1

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
let reversed = [...arr].reverse();		//arr는 변경하지 않고 새로운 배열 생성
// arr를 90도 회전
let rotated = Object.keys(reversed[0]).map(col => reversed.map(row=>row[col]));
console.log(rotated);
/* 
[
  [7, 4, 1],
  [8, 5, 2],
  [9, 6, 3]
]
*/

방법2

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9]];
function rotate90(arr) {
  N = arr.length;
  let res = new Array(N).fill().map((v) => new Array(N).fill(0));

  for (let i = 0; i < N; i++) {
    for (let j = 0; j < N; j++) {
      res[j][N - 1 - i] = arr[i][j];
    }
  }
  return res;
}