Javascript - array

안녕하세요, 오늘은 자료구조에 대해 공부할 때 꼭 필요한 array(배열)에 대해 정리하겠습니다.

 

1. Declaration : 정의하는 방법으로는 2가지가 있습니다. 리터럴 형식의 정의와 new Array()를 이용하는 방법이 있습니다.

const arr1 = new Array();
const arr2 = [1, 2]; // 리터럴 형식

 

2. Index position : 배열 내 요소들에는 각각 인데스가 배정이 되고 시작은 0부터 시작합니다.

const fruits = ['apple','banana'];
console.log(fruits);
console.log(fruits.length); // 2 출력(요소의 수를 확인할 수 있다.)
console.log(fruits[0]); // apple 출력
console.log(fruits[1]); // banana 출력
console.log(fruits[2]); // 없는 것이므로 undefined 출력
console.log(fruits[fruits.length - 1]); // Tip : 리스트의 마지막을 출력하려면 length(요소 전체의 수) - 1(인덱스가 0부터시작)을 하면된다

 

3. Looping over an array : 배열을 반복할 수가 있다. i라는 변수를 설정 후 0부터 증가시키며 인덱스를 하나씩 출력할 수 있었습니다. 다른 쉬운 방식으로는 for ...of문과 더 간단한 방식으로는 forEach라는 내장 함수를 사용하는 것입니다. forEach 매서드는 주어진 함수를 배열 요소 각각에 대해 실행해줍니다.

// a. Use for loop : i를 증가시키며 하나씩 출력
for(let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

// b. Use for of : for of문을 이용해 요소를 하나씩 출력
for(let fruit of fruits) {
    console.log(fruit);
}

// c. Use forEach : 내장함수 forEtch 사용
fruits.forEach((fruit) => console.log(fruit));

4. Addition, deletion, copy : 배열을 추가 및 삭제할 수 있습니다.

-. push : 배열의 끝에서 부터 아이템을 추가

-. pop : 배열의 끝에서 부터 아이템을 삭제

-. unshift : 배열의 시작에서 부터 아이템을 추가

-. shift : 배열의 시작에서 부터 아이템을 삭제

-. splice : 원하는 인덱스의 요소를 삭제하거나 추가 [ .splice(시작 인덱스 No, 삭제할 개수, 추가할 요소) ]

-. concat : 배열 여러 개를 이어 붙이거나 값을 뒤에 붙임

여기서 주의할 점으로는 shift와 unshift는 pop, push에 비하여 느립니다! (앞에서 부터 삭제하거나 추가하려면 뒤의 요소들을 이동시켜서 자리를 바꿔줘야 하기 때문입니다)

const fruits = ['apple','banana'];

fruits.push('melon', 'peach'); // ["apple", "banana", "melon", "peach"]
console.log(fruits); // ["apple", "banana", "melon", "peach"] 출력

// pop: remove an item from the end
fruits.pop(); // ["apple", "banana", "melon"]
console.log(fruits); // ["apple", "banana", "melon"] 출력

// unshit: add an item to the beginning
fruits.unshift('mango', 'orange'); // ["mango", "orange", "apple", "banana", "melon"]
console.log(fruits); // ["mango", "orange", "apple", "banana", "melon"] 출력

// shift: remove an item to the beginning
fruits.shift(); // ["orange", "apple", "banana", "melon"]
fruits.shift(); // ["apple", "banana", "melon"]
console.log(fruits); // ["apple", "banana", "melon"] 출력

// note!! shift, unshift are slower than pop, push
// splice: remove an item by index position
fruits.push('lemon','peach'); // ["apple", "banana", "melon", "lemon", "peach"]
console.log(fruits); // ["apple", "banana", "melon", "lemon", "peach"] 출력
fruits.splice(1,1); // ["apple", "melon", "lemon", "peach"] : 인덱스 "1" 에서 하나를 제거
console.log(fruits); // ["apple", "melon", "lemon", "peach"] 출력
fruits.splice(1,1,'strawberry','mango'); // ["apple", "strawberry", "mango", "lemon", "peach"] : 인덱스 "1" 에서 하나를 제거한 후 strawberry와 mango 삽입
console.log(fruits); //["apple", "strawberry", "mango", "lemon", "peach"] 출력

// combine two arrays 두개의 배열을 합친다
const fruits2 = ['pair', 'orange'];
const newFruits = fruits.concat(fruits2); // ["apple", "strawberry", "mango", "lemon", "peach", "pair", "orange"]
console.log(newFruits); // ["apple", "strawberry", "mango", "lemon", "peach", "pair", "orange"] 출력

 

5. Searching : 인덱스를 찾을 수 있습니다.

-. indexOf : 배열에서 요소의 인덱스가 몇인지 확인 ( 없는 요소인 경우 -1 출력 )

-. includes : 배열안에 요소의 유무를 True/False로 나타냄

-. lastIndexOf : 중복된 요소가 있을 경우 마지막 요소의 인덱스를 출력

console.log(fruits); // 위 예제의 fruits 배열 ["apple", "strawberry", "mango", "lemon", "peach"]
console.log(fruits.indexOf('pair')); // 없는 값이라면 -1이 출력된다!
console.log(fruits.indexOf('mango')); // 2 출력
console.log(fruits.includes('Watermelon')); // False 출력 안에 있는지 없는지 T/F로 나타내어줌 

// lastIndexOf
fruits.push('mango'); // ["apple", "strawberry", "mango", "lemon", "peach", "mango"]
console.log(fruits); // ["apple", "strawberry", "mango", "lemon", "peach", "mango"] 출력
console.log(fruits.indexOf('mango')); // 배열안에 중복된 값이 있다면 indexOf를 사용하면 앞의 요소에 대한 인덱스 출력 [2]
console.log(fruits.lastIndexOf('mango')); // lastIndexOf 사용이 중복값 중 마지막 요소의 인덱스 출력 [5]