📝 배열(Array)

변수를 묶음으로 다루는 것(변수가 연속적으로 나열됨)

• JS 변수 : 값이 저장되기 전까지 자료형이 지정되지 않음

• JS 배열의 특징
  1. 자료형 제한 X
  2. 길이 제한 X
  
  
  

📌 배열 선언 방법

💡 const arr = new Array();

💡 const arr = [];

✏️ 코드로 살펴보기

• html

    <button id="btn1">배열 확인 1(콘솔)</button>

• js

// 배열 확인 1
document.getElementById("btn1").addEventListener("click", function(){
  
    // 배열 선언 방법
    const arr1 = new Array(3); // 3칸짜리 배열 생성
    const arr2 = new Array(); // 0칸짜리 배열(비어 있는 배열) 생성

    // console.log(arr1);
    // console.log(arr2);

    // 다른 자료형 대입
    arr1[0] = "김밥";
    arr1[1] = 123;
    arr1[2] = true;
    console.log(arr1);

    // 0칸 배열에 대입
    arr2[0] = "김밥";
    arr2[1] = 123;
    arr2[2] = true;
    console.log(arr2);

    // 배열 선언 방법
    const arr3 = []; // 비어 있는 배열 (0칸)
    const arr4 = ["사과", "딸기", "바나나"]; // 선언 및 초기화

    // for문으로 배열 요소 반복 접근하기
    // 1. 일반 for문

    // 2. 향상된 for문 (for ... of) : 배열용 향상된 for문
    for(let item of arr4){ // arr4 배열에서 요소를 하나씩 얻어와 item에 대입
        console.log(item);
    }
})

✏️ 출력 화면

---

📌 배열 관련 함수

(Stack 구조 관련 함수)

💡 push()

배열 마지막 요소로 추가함

💡 pop()

배열의 마지막 요소를 꺼내옴

💡 배열.indexOf("값")

일치하는 값을 가진 요소의 index를 반환, 없으면 -1 반환

💡 배열.sort([정렬기준 함수])

배열 내 요소를 오름차순 정렬(문자열)
-> 단, [정렬기준 함수]가 작성되면 정렬 결과가 달라짐

숫자 오름차순 정렬

배열.sort(function(a,b){ return a-b; } ) );

숫자 내림차순 정렬

배열.sort(function(a,b){ return b-a; } ) );

💡 배열.toString()

배열 요소를 하나의 문자열로 출력
-> 요소 사이에 "," 추가

💡 배열.join("구분자")

배열 요소를 하나의 문자열로 출력
-> 요소 사이에 "구분자" 추가

✏️ 코드로 살펴보기

• html

    <button id="btn2">배열 확인 2(콘솔)</button>

• js

// 배열 확인 2
document.getElementById("btn2").addEventListener("click", function(){

    // 비어 있는 배열 생성
    const arr = [];

    // push() : 배열 마지막 요소로 추가
    arr.push("삼겹살");
    arr.push("곱창");
    arr.push("초밥");
    arr.push("치킨");

    console.log(arr);
    
    // pop() : 배열 마지막 요소 꺼내오기
    console.log("꺼내온 요소 : " + arr.pop());
    console.log(arr);

    // 배열.indexOf("값") : 일치하는 값을 가진 요소의 index를 반환
    console.log("초밥 인덱스 : " + arr.indexOf("초밥"));
    console.log("갈비 인덱스 : " + arr.indexOf("갈비"));

    // 배열.sort([정렬기준 함수]) : 배열 내 요소를 오름차순 정렬(문자열)
    const arr2 = [5, 3, 2, 10, 1];

    console.log(arr.sort()); // 문자열

    console.log(arr2.sort()); // 숫자 -> 정상 정렬 X
                              // 왜? 문자열로 변환돼서 정렬되기 때문에
                              // (문자열 정렬 기준이 기본값)
    // 숫자 오름차순 정렬
    console.log( arr2.sort(function(a,b){ return a-b; } ) );   

    // 문자열로 출력
    console.log( arr.toString() );
    console.log( arr.join("/") );
})

✏️ 출력 화면

---