Array 선언

• 배열을 선언하는 두가지 방법

const arr1 = new Array();
const arr2 = [1, 2, 3, 4];

Index를 통한 접근

<script>
	const fruits = ['apple','banana'];
    console.log(fruits);        //apple, banana
    console.log(fruits.length); //2
    console.log(fruits[1]);     //banana
    console.log(fruits[0]);     //apple
</script>

• 배열의 마지막 아이템을 찾을 때

console.log(fruits[fruits.length - 1]);

배열의 모든 아이템 출력하기

1. for

<script>
    for(let i=0; i<fruits.length; i++){
        console.log(fruits[i]); 
    }
</script>

2. for of

<script>
    for(let fruit of fruits){
        console.log(fruit);
    }
</script>

3. forEach

<script>
    fruits.forEach(function(fruit, index){
         console.log(fruit);
         console.log(index); //0, 1
    });

    //한줄로 
    fruits.forEach((fruit) => console.log(fruit));
</script>

아이템 추가, 삭제, 결합

- push : 배열 맨 뒤에 아이템 추가

fruits.push('melon','orange');

- pop : 배열 맨 뒤 아이템 삭제

fruits.pop();

- unshift : 배열 맨 앞에 아이템 추가

fruits.unshift('lemon','strawberry');

- shift : 배열 맨 앞 아이템 삭제

fruits.shift();

🙋‍♀️ 중요!! shift와 unshift는 pop,push보다 속도가 매우매우 느리다.
앞의 데이터를 지우고 넣기 위해서 뒤의 데이터들도 당겨오거나 밀려나는 움직임이 필요하기 때문에 배열의 길이가 길면 길수록 전체의 배열을 움직이게 되어 속도가 느려진다.

- splice : 원하는 위치의 아이템 제거

<script>
    fruits.splice(1);    // 1번째부터 끝까지 지우겠다! 
    fruits.splice(1, 1); // 1번째부터 1개를 삭제 
    fruits.splice(1, 1, 'banana', 'watermelon'); //1을 지운 자리에 이 아이템들을 넣어줘!
    
    console.log(fruits); // 삭제된 요소가 리턴됨!
</script>

- concat : 두 배열 합치기

<script>
    const fruit3 = ['blueberry','avocado'];
    const newFruits = fruits.concat(fruit3); //기존배열 fruits에 새배열 fruit3을 합쳐줘!
    console.log(newFruits);
</script>

Searching

- indexOf : 아이템이 몇번째 index에 있는지 검색

<script>
    console.log(fruits.indexOf('apple')); // apple의 위치는? 0
    console.log(fruits.indexOf('peach')); // peach의 위치는? 5
</script>

- lastIndexOf : 중복되는 아이템이 있을 때, 가장 마지막 아이템의 위치를 리턴

<script>
    console.log(fruits.indexOf('apple')); //indexOf는 맨 처음 아이템의 위치를 리턴 
    console.log(fruits.lastIndexOf('apple')); //lastIndexOf는 마지막 아이템의 위치 리턴
</script>

- includes : 해당 아이템이 있는지 검사 (true/false,-1)

<script>
    console.log(fruits.includes('blueberry')); // false or -1
    console.log(fruits.includes('strawberry')); // true
</script>

👉 Dream Coding 영상을 정리한 내용입니다.