일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
Tags
- axios
- react localStorage
- Redux
- 원티드
- Frontend
- 프로그래머스
- Reducer
- localstorage
- JavaScript
- 파이어베이스
- til
- Component
- array
- react
- 브라우저
- 타입스크립트
- firebase
- TypeScript
- 자바스크립트
- es6
- CORS
- 컴포넌트
- 프리온보딩
- 비트 연산자
- JS
- 알고리즘
- 리액트
- state
- 프론트엔드
- v9
Archives
- Today
- Total
도리쓰에러쓰
[JavaScript] 주로 사용하는 배열 메서드 모음 (Array Method Collection) 본문
알고리즘 문제를 풀면서 배열 메서드를 많이 접하는데,
주로 사용하는 배열 메서드를 블로그에 남기고 머릿속에 남기고 싶어서 한 눈에 보기 쉽게 정리했습니다.
1️⃣ 배열에 값 추가 혹은 삭제하는 메서드
// 배열 끝에 값 추가
[1, 2, 3].push(4); // [1, 2, 3, 4]
// 배열 끝에 값 삭제
[1, 2, 3].pop(); // [1, 2]
// 배열 앞에 값 추가
[1, 2, 3].unshift(4); // [4, 1, 2, 3]
// 배열 앞에 값 삭제
[1, 2, 3].shift(); // [2, 3]
2️⃣배열 조작하는 메서드
// 배열 합치기
['a', 'b', 'c'].concat(['d', 'e'], 'f'); // ['a', 'b', 'c', 'd', 'e', 'f']
// 배열 원소 연결하여 하나의 문자열 만들기
['a', 'b', 'c'].join('/'); // 'a/b/c'
// 배열 자르기
['a', 'b', 'c'].slice(2); // ['c']
['a', 'b', 'c', 'd', 'e'].slice(1, 3); // ['b', 'c']
// 배열의 length만큼 반복됨
[1, 2, 3, 4].map((x) => x * 2); // [2, 4, 6, 8]
// map()처럼 반복문을 돌리지만 순회 중 누산기(acc)에 값이 유지됨
[1, 2, 3, 4].reduce((acc, cur) => acc + cur); // 10
// 배열을 역순으로 정렬하기
[1, 2, 3, 4].reverse(); // [4, 3, 2, 1]
3️⃣ 배열의 값(원소)이나 인덱스 값 찾거나 검색하는 메서드
// 배열 원소 인덱스 구하기
['a', 'b', 'c'].indexOf('a'); // 0
// 배열 원소 포함되어 있는지 여부 확인하기
['a', 'b', 'c'].includes('a'); // true
// 배열 특정 값 찾기 (조건문에서 맞는 값 중 첫번째 값만 return)
[1, 2, 3, 4].find((x) => x < 3); // 1
// 배열 특정 인덱스 값 찾기 (조건문에서 맞는 값 중 첫번째 값의 인덱스만 return)
[1, 2, 3, 4].findIndex((x) => x < 3); // 0
// 테스트에 충족하는 배열 원소 모두 찾기
[1, 2, 3, 4].filter((x) => x % 2 == 0); // [2, 4]
// 배열의 모든 원소가 테스트에 충족하는지 확인하기
[1, 2, 3, 4].every((x) => x < 5); // true
// 배열의 원소들이 테스트에 하나라도 충족하는지 확인하기
[1, 2, 3, 4].some((x) => x < 2); // true
// 배열에서 해당 값에 해당하는 인덱스 return
[1, 2, 3, 4].at(2); // 3
[1, 2, 3, 4].at(-1); // 4
주로 사용하는 것만 작성했는데 그 외의 배열 메소드를 찾고 싶다면 아래 페이지 참고하세요 !
JavaScript Array Reference
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com
'JavaScript > JS' 카테고리의 다른 글
[JavaScript] 주로 사용하는 문자열 메서드 모음 (String Method Collection) (0) | 2022.03.23 |
---|---|
[JavaScript] 밀리초 일, 시, 분, 초 계산하기 (D-day 기능 구현) (0) | 2022.03.16 |
[JavaScript] 배열 중복 원소 제거해주는 Set 객체 (0) | 2022.03.07 |
[JavaScript] ES6에 추가된 객체 리터럴 기능 3가지 (0) | 2022.03.04 |
[JavaScript] null 병합 연산자 (Nullish Coalescing Operator) - ?? (0) | 2022.03.02 |
Comments