2024. 07. 23.(JavaScrip 기본 문법 정리 - 배열)

1. 생성

1-1. 기본 생성

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

-> 순서가 0부터 시작된다.

 

1-2. 크기 지정

let number = new Array(5);

-> 크기가 5인 배열을 만들어 달라는 명령어

 

2. 요소 접근

console.log(fruits [0]);

-> fruits 객체의 0번째 즉 "사과"가 출력된다.

 

3. 배열 메소드

3-1. push : 제일 마지막에 값을 추가

fruits. push("값")

-> fruits. 제일 뒤에 "값"을 추가시킨다.

 

3-2. pop : 제일 마지막 객체 삭제

fruits. pop();

-> fruits. 안에 있는 객체 중 제일 마지막 객체를 삭제시킨다.

 

3-3. shift : 제일  첫번째 객체 삭제

fruits. shift():

-> fruits. 안에 있는 객체 중 제일 첫번째 객체를 삭제시킨다.

 

3-4. unshift : 제일 첫번째에  값을 추가

fruits. unshift("값")

-> fruits. 제일 앞에 "값"을 추가시킨다.

 

3-5. splice : 삭제 및 변환

fruits. splice(어디서부터, 몇개까지 지우고, 이것을 대신 입력해줘)

ex. let fruits = ["사과", "바나나", "키위"];

      fruis. splice(1, 1, "포도");

      -> "사과", "포도", "키위"로 결과값이 나온다.

 

3-6. slice : 객체를 따로 빼서 새로 생성함.

let sliceFruits =  fruits. slice(어디서부터, 어디앞까지);

ex. let fruits = ["사과", "바나나", "키위"];

      fruis. slice(1, 2);

      -> 1번째 배열부터, 2번째 배열 앞에까지, 즉 "바나나"만 출력된다.

 

4. forEach

numbers. forEach(function()){};

* 매개변수 자리에 함수를 넣는 걸 콜백 함수라고 한다.

배열에 forEach를 시행하였을 때 각각의 객체가 한번씩 실행된다.

ex) let numbers = [2,3,5,3,1]

      numbers. forEach(function(item) {

     console. log(+ item);

})

-> 각각 [2] [3] [5] [3] [1]로 결과값이 나오는데 이는 각 배열 객체마다 한번씩 함수를 실행시켰다는 뜻이다.

 

5. map : 기존 배열을 가공하여 새로운 배열을 생성해내므로, return이 꼭 있어야한다.

                항상 원본 배열의 길이만큼이 return 된다.

numbers. map(fuction(item)){

return tiem*2;

});

console.log(newNumbers);

-> 각 배열 *2이므로, [4, 6, 10, 6, 2]

     return을 안하더라도 undefined로 배열이 채워진다.

 

6. filter

numbers.filter(function(item) {

return item 조건

}

item === "값", 값인 것만 나오고, item!=="값" 값이 아닌 것들만 나오듯 걸려져서 나온다.

 

7. find = filter와 같이 조건에 맞는 것만 걸러지지만, 그 중 첫번째만 반환된다.

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

let result = numbers. find(fuction (item) {

return item >2;

}

-> 2보다 큰 수 중 제일 첫번째인 '3'만 반환된다.