[JS] Ex18_배열.html

JS의 배열을 배우다.

---

1. 배열의 선언

       // 1. 배열의 선언
       // let 배열이름 = [];
       // 주의사항.
       // undefined으로 선언하지 말 것. 변수 선언 때도 똑같음-> let 배열이름;
        let menuList = ["아메리카노", "카페라떼", "지우개"];

배열 : 수많은 데이터 중에서 연관된 데이터를 하나에 담는 공간

배열에는 데이터를 구분할 수 있는 인덱스가 존재한다. 첫 번째가 0부터 시작한다.

 

2. 배열의 확인 및 요소 접근

        // 2. 배열의 확인
        console.log(menuList)
        
        // 3. 배열 내 특정 요소 접근
        // 배열이름[인덱스번호]
        console.log(`${menuList[1]} 나왔습니다.`);

결과

출력문에 배열이름을 넣으면 배열이 나온다

배열이름[인덱스번호] = 요소

 

3. 배열 내 요소 값 변경

        menuList[0] = "돌"
        console.log("new list: ", menuList)

결과

첫 번째 요소를 변경하기 위해 인덱스 0번에 넣고 싶은 값을 쓰면 변경이 된다.

 

4. 배열의 길이

console.log("길이: ", menuList.length)

결과

배열이름.length : 배열의 길이를 구하는 방법

 

5. 배열 내 전체 출력

        let menuList = ["아메리카노", "카페라떼", "지우개"];
        menuLen = menuList.length
        for(i = 0; i <= menuLen - 1; i++){
            console.log("모든 메뉴", menuList[i]);
        }

반복문을 통해 배열 내의 요소를 모두 출력한다. 하나씩 출력하는데 인덱스로 접근해서 출력한다. 

최대 인덱스는 배열 길이 - 1과 같다. 그래서 0 ~ 배열길이 - 1 까지 인덱스를 접근하면 된다.

 

6. 배열과 관련된 함수

        // 배열 함수 : 배열을 쉽게 사용하도록 제공해주는 함수

        let lunch = ["참치마요삼김", "튀김우동", "스프라이트", "우동"]

        // 1. 마지막 인덱스의 값을 넣어주기!: 리스트.push(넣어줄 값)
        lunch.push("KT");
        console.log(lunch);
        
        // 2. 마지막 인덱스의 값을 빼준다. : 리스트.pop()
        lunch.pop();
        console.log(lunch);

        // 3. 해당 요소가 배열 내에 포함되어있는지 검사: 리스트.includes(검사요소)
        //  검색기능, 필터링 기능
       console.log(lunch.includes("스테이크"));
        // 4. 해당 요소의 인덱스 번호 확인: 리스트.indexOf(해당요소)
        console.log(lunch.indexOf("튀김우동"));

        // 5. slice() - 추출(기존 배열에 영향 X) vs splice() - 제거(기존 배열에 영향 O)
        // 5 - 1) 배열이름.slice() 마지막 인덱스 포함 X (파이썬과 같다.)
        console.log("unit", lunch.slice(0,3));
        console.log("기존", lunch);

        // 5 - 2) 배열이름.splice(시작인덱스, 제거할개수, 대체값)
        // 제거할 개수 0으로 하면 대체값만 추가됨
        lunch.splice(1, 2, "냉면")
        console.log("현재 배열", lunch)

결과