배열(Array) ?
- 배열은 하나의 변수에 하나의 값이아닌 여러개의 값을 저장하며 각 요소들은 순서를 가진다.
- 자바스크립트 배열의 요소는 여러가지 타입선언(String, Number, Boolean, Object, Array..) 가능.
- 자바스크립트 배열의 크기는 동적으로 변경될 수 있다. (가변적)
- 자바스크립트 배열은 대괄호'[]' 또는 Array() 생성자함수를 사용하여 생성한다.
배열 내장함수(Array Mehods) ?
1. forEach: 배열의 요소들을 순차적으로 불러와 이를 활용할 때 사용.
2. map: 기존의 배열 요소를, 특정한 로직에 의해 새로운 배열로 변환할 때 사용.
3. reduce: 배열의 요소를 이용하여 특정 연산을 수행 할 때 사용. (평균 값, 합산, 특정조건 요소개수)
4. filter: 기존배열에서 특정 조건에 맞는 요소들을 추출하여 새로운 배열생성.
5. indexOf, findIndex, find
- indexOf, findIndex: 배열요소의 위치(Index) 확인.
- find: 조건에 맞는 배열요소를 자체를 반환.
6. splice, slice: 배열요소 일부를 잘라내며 splice는 기존배열 영향O, slice는 기존배열 영향X
7. shift, pop, unshift, concat, join
- shift: 앞에서부터 요소추출(기존배열 영향O)
- pop: 뒤에서부터 요소추출(기존배열 영향O)
- unshift: 기존배열에 맨 앞에 원소를 추가 (기존배열 영향O)
- concat: 서로다른 두 배열을 하나의 배열로 결합
- join: 배열요소를 문자열로 변환
(Array Methods) Exercise..
1. 배열내장함수(forEach) 사용 및 결과확인
* 자바스크립트 내장함수:: forEach( CallBackFn( Parameters... ) )
* CallBackFn( Parameters... )
- 첫번째 파라미터: 배열 각 요소
- 두번째 파라미터: 인덱스 번호
- 세번째 파라미터: 배열자체(전체배열)
2. 배열내장함수(map) 사용 및 결과확인
3. 배열내장함수(reduce) 사용 및 결과확인
* 자바스크립트 내장함수:: reduce( CallBackFn( Parameters... ) )
* reduce() 메서드는 배열의 각 요소에 대해 주어진 리듀서(reducer) 함수를 실행하고,
하나의 (계산된)결과값을 반환합니다. 기존 배열에 영향을 미치지X
/**
첫번째 파라미터 :: CallBackFn
--> CallBackFn 파라미터 (누적 값, 배열요소[순차적], 인덱스, 배열[전체])
두번째 파라미터 :: 초기 값
*/
4. 배열내장함수(filter) 사용 및 결과확인
* 자바스크립트 내장함수:: filter( CallBackFn( Parameters... ) )
// 기존 배열에 영향을 미치지X
5. 배열내장함수(IndexOf, findIndex, find) 사용 및 결과확인
6. 배열내장함수(splice, slice) 사용 및 결과확인
// splice : 기존배열에 영향을 미침
// slice : 기존 배열에 영향을 미치지 않음
7. 배열내장함수(shift, pop, unshift, concat, join) 사용 및 결과확인
exit..
'FrontEnd_JavaScript' 카테고리의 다른 글
[JavaScript] 비동기(Asynchronous) 처리 - Promise (1) (0) | 2021.10.13 |
---|---|
[JavaScript] 함수(Function) 선언 및 활용. (0) | 2021.09.22 |