오늘은 배열 기초를 배우고 관련된 코플릿 문제를 풀었다. 그중에 배열에서 특정 인덱스의 요소를 제거하는 문제가 있었는데 slice로 주어진 인덱스 앞 뒤로 배열을 잘라 concat으로 이어붙여야 하나 했는데 페어 분께서 splice가 있다는 걸 상기시켜주셨다. 항상 쓰는 것만 쓰다 보니 자주 쓰지 않는 것들은 헷갈리기도 하고 몇몇은 이런 메소드도 있었나 싶다. 기초 부분은 정리할 것이 많지 않아 내장 메서드를 복습겸 한 번 정리해 보았다.
Today I Learned
배열인지 아닌지 확인하기
Array.isArray( value )
- return type :
boolean - 인자가 Array면 참, 아니면 거짓 반환
배열 생성하기
Array.from( arrayLike )
- return type :
Array - 인자로 주어진 유사 배열 객체(array-like object)*나 반복 가능 객체(iterable object)*를 얕은 복사(shallow copy)*해 새로운 Array를 만듦
Array.of( ...elements )
- return type :
Array - 주어진 인자로 새로운 Array를 만듦
Array(3)은[ , , ]를 생성하지만Array.of(3)은[3]를 생성
배열 길이 구하기
length
- return type :
number - 배열의 길이 반환
배열 탐색하기
at( idx )
- return type : -
- 배열에서 idx 인덱스 위치에 있는 요소를 반환
array.at(-1) === array[array.length-1]
find( ( el[, idx, array] ) => {...} )
- return type : -
- 배열에서 테스팅 함수를 만족하는 첫 번째 요소의 값을 반환
- 만족하는 요소가 없다면
undefined을 반환
findIndex( ( el[, idx, array] ) => {...} )
- return type :
number - 배열에서 테스팅 함수를 만족하는 첫 번째 요소의 인덱스 값을 반환
- 만족하는 요소가 없다면
-1을 반환
includes( searchElement[, fromIdx] )
- return type :
boolean - 배열 안에 인자로 주어진 값이 존재하면 참, 아니면 거짓 반환
indexOf( searchElement[, fromIdx] )
- return type :
number - 배열 안에서 인자로 주어진 값과 동일한 첫 번째 요소의 인덱스 값을 반환
- 만족하는 요소가 없다면
-1을 반환
lastIndexOf( searchElement[, fromIdx] )
- return type :
number - 배열 안에서 인자로 주어진 값과 동일한 마지막 요소의 인덱스 값을 반환
- 만족하는 요소가 없다면
-1을 반환
특정 조건을 만족하는 요소 찾기
every( ( el[, idx, array] ) => {...} )
- return type :
boolean - 배열의 모든 요소가 테스팅 함수를 만족시키면 참, 아니면 거짓 반환
some( ( el[, idx, array] ) => {...} )
- return type :
boolean - 배열의 요소들 중 하나라도 테스팅 함수를 만족시키면 참, 아니면 거짓 반환
요소 추가/제거하기
pop()
- return type : -
- 배열의 가장 마자막 요소를 제거하고 그 요소를 반환
- 빈 배열의 경우
undefined를 반환
push( ...elements )
- return type :
number - 배열의 가장 마지막에 요소를 추가하고 변형된 배열의
length속성값을 반환
shift()
- return type : -
- 배열의 가장 첫 번째 요소를 제거하고 그 요소를 반환
- 빈 배열의 경우
undefined를 반환
unshift( ...elements )
- return type :
number - 배열의 가장 앞에 요소를 추가하고 변형된 배열의
length속성값을 반환
splice( startIdx[, deleteCount, ...elements] )
- return type :
Array - startIdx에서부터 deleteCount개의 요소를 제거하고 그 자리에 새로운 요소를 삽입
- 제거된 요소들을 담은 배열을 반환하고 만약 제거된 요소가 없을 경우 빈 배열을 반환
slice( [startIdx, endIdx] )
- return type :
Array - startIdx에서부터 endIdx 바로 앞까지 요소들을 얕은 복사하여 새로운 배열에 담아 반환
- 원본 배열은 변경되지 않음
- 인자가 아무것도 주어지지 않으면 원본 배열 전체를 얕은 복사하여 반환
concat( ...elements )
- return type :
Array - 인자로 주어진 배열이나 값들을 추가한 새로운 배열 반환
- 원본 배열은 변경되지 않음
요소 순서 변경하기
sort( [compareFunction] )
- return type :
Array - 배열의 요소를 comapre 함수에 따라 정렬한 후 반환
- 디폴트는 문자열의 유니코드 순서를 따름
- 원본 배열을 변경
reverse()
- return type :
Array - 배열의 순서를 반전하여 반환
- 원본 배열을 변경
배열 변형하기
filter( ( currentEl[, idx, array] ) => {...}[, thisArg] )
- return type :
Array - 배열 안의 요소들 중 테스팅 함수를 만족시키는 요소들만 모은 새로운 배열을 만들어 반환
map( ( currentEl[, idx, array] ) => {...}[, thisArg] )
- return type :
Array - 배열 내 모든 요소 각각에 주어진 함수를 호출한 결과를 모은 새로운 배열을 만들어 반환
thisArg는 콜백 함수의this값으로 사용됨 (기본값은undefined)
fill( value[, startIdx, endIdx] )
- return type :
Array - 배열의 startIdx부터 endIdx 바로 앞까지 인자로 주어진 값으로 채워 반환
- 원본 배열을 변경
flat( [depth] )
- return type :
Array - 배열 안의 모든 하위 배열을 지정한 깊이까지 평평하게 만든 새로운 배열을 만들어 반환
- 매개변수
depth가 지정되어 있지 않은 경우 기본값은1 - 배열에 구멍(값이 없이 비어있는 인덱스)이 있는 경우 제거
기타
forEach( ( currentEl[, idx, array] ) => {...}[, thisArg] )
- return type :
undefined - 배열 내 모든 요소 각각에 주어진 함수를 호출 (
for (let el of arr) {...})
join( [separator] )
- return type :
string - 배열의 모든 요소를 separator로 연결하여 하나의 문자열로 만들어 반환
- cf.
String.prototype.split( [separator] )
reduce( (accumulator, currentEl[, idx, array]) => {...}[, initialValue] )
- return type : -
- 배열 내 모든 요소 각각에 주어진 reducer 함수를 실행한 누적 결과값을 반환
initialValue의 기본값은 배열의 첫 번째 요소
배열 매서드 사용하여 문제풀기
splice & indexOf
// Q.
// 점심시간 붐비는 식당에서 입장을 기다리는 손님들의 이름을 도착한 순서대로 담은 배열이 있다.
const waitingQueue = ['Harry', 'Ron', 'Hermione', 'Draco', 'Luna'];
// 그런데 'Viktor'가 'Hermione'의 바로 뒤에 끼어 들었다.
// 이를 반영하여 배열을 변경하면?
// A.
// 1. 'Hermione' 바로 다음 index 찾기
let indexOfViktor = waitingQueue.indexOf('Hermione') + 1;
// 2. 찾은 index 위치에 'Viktor' 삽입
waitingQueue.splice(indexOfViktor, 0, 'Viktor');fill & map
// Q.
// 빈 2차원 배열을 만들어라
// 행의 길이는 3
// 열의 길이는 2
// A.
const arr = Array(3).fill(null).map(() => Array(2));
// [[ , ],
// [ , ],
// [ , ]]filter
// Q.
// 다음 배열에서 짝수만 골라 새로운 배열을 만들어라
const arr = [1, 2, 3, 4, 5, 6, 7, 8];
// A.
const newArr = arr.filter((n) => n % 2 === 0);
🦄✨글 잘 쓰는 개발자가 되기 위해 꾸준히 기록합니다 ✨🦄