배열

1. 생성

1-1. 기본 생성

let fruits = ["사과", "바나나", "오렌지"];

배열의 기본 생성 모습 확인.

[ '사과', '바나나', '오렌지' ]

결과값 확인.

1-2. 크기 지정

let number = new Array(5);

[ <5 empty items> ]

생성은 했지만 빈 배열임을 확인 할수 있다.

2. 요소 접근

console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);

사과
바나나
오렌지

각 요소에 접근 확인.

3. 배열 메소드

3-1. push

let fruits2 = ["사과", "바나나"];
fruits2.push("오렌지");

[ '사과', '바나나', '오렌지' ]

바나나 뒤에 오렌지가 정상적으로 들어간 것을 확인.

3-2. pop

let fruits3 = ["사과", "바나나"];
fruits3.pop(fruits3);

[ '사과' ]

배열의 마지막 요소인 바나나를 삭제한 모습.

3-3. shift

let fruits4 = ["사과", "바나나", "키위"];
fruits4.shift();

[ '바나나', '키위' ]

배열의 첫번째 요소인 사과를 삭제한 모습.

3-4. unshift

let fruits5 = ["사과", "바나나", "키위"];
fruits5.unshift("포도")

[ '포도', '사과', '바나나', '키위' ]

배열 뒤쪽이 아닌 앞쪽에 추가된 모습 확인.

3-5. splice

let fruits6 = ["사과", "바나나", "키위"];
fruits6.splice(1, 1, "포도");

[ '사과', '포도', '키위' ]

배열의 위치, 갯수, 새로운요소 를 집어 넣을수 있다.
즉 배열의 두번째 위치에서 바나나 한개의 요소를 지우고 포도를 집어 넣은것.

나는 사과 바나나를 빼고 포도를 넣고 싶어 하면

let fruits6 = ["사과", "바나나", "키위"];
fruits6.splice(0, 2, "포도");

이런식으로 작성이 가능 하겠다.

[ '포도', '키위' ]

결과 확인.

3-6. slice

let fruits7 = ["사과", "바나나", "키위"];
let slicedfruits = fruits7.slice(0, 2);

[ '사과', '바나나' ]

선택된 요소만을 가지고 새로운 배열을 만들어 낸것인데,
배열의 첫번째 위치에서 두개의 요소 사과 와 바나나를 가지고 새로운 배열을 만든것.

콜백함수 (forEach, map, filter, find)

쉽게 매개변수 자리에 함수를 넣는 것을 콜백함수 라 할수 있겠다.

우선 배열을 생성 하고 시작 하겠다.

let numbers = [1, 2, 3, 4, 5];

1. forEach

numbers.forEach(function(item){
    console.log("forEach순회중 => " + item);
});

forEach순회중 => 1
forEach순회중 => 2
forEach순회중 => 3
forEach순회중 => 4
forEach순회중 => 5

배열의 각각 요소에 들어 간것을 확인 할수 있는데,
쉽게 말해 주어진 함수를 배열 요소 각각에 대해 실행하는 메서드이다.

2. map

let newnumbers = numbers.map(function(item){
    return item * 2;
})

[ 2, 4, 6, 8, 10 ]

기존에 있던 배열을 가공해서 새로운 배열을 생성한것을 볼수 있다.
return시 원본 배열의 길이만큼 return된다.

3. filter

let filterednumbers = numbers.filter(function(item){
    return item < 3;
})

[ 1, 2 ]

배열중에서 필터링 할 조건이 들어가게 된다.

4. find

let result = numbers.find(function (item) {
    return item > 1;
})

2

리턴문을 통해 조건에 맞는 배열의 첫번째 요소를 반환된 모습 확인.

마무리

배운 문법 들이 많다보니 배운 것들을 되돌아보는 TIL만 작성하게 되는거 같다.
덕분에 쉽게 잊어 버리지는 않을거 같다.