Array(배열)

Array

 

 

▶ 단순하게 같은 자료형을 나열한 것이다. 다른 자료형을 섞을 수는 있지만 그런 식으로 사용하지 않는 게 좋다.

 

 

▶ 배열을 만드는 방법은 크게 2가지로, 생성자 함수와 대괄호를 이용하는 방법이 있다.

 

// 생성자 함수

// 1
let arr1 = new Array(2, 5, 9);

console.log(arr1); // [2, 5, 9]

// 2
let arr2 = new Array(3); // 길이가 3인 배열을 생성한다.

console.log(arr2); // [ <3 empty items> ]

// 3
let arr3 = Array.of(1, 7, 8);

console.log(arr3); // [1, 7, 8]

// 4
let arr4 = [1, 2, 3, 4]

let arrFrom = Array.from(arr4)

console.log(arrFrom); // [1, 2, 3, 4]

// 5
// 객체를 생성하는 방식으로도 배열을 생성할수 있다. 인덱스 번호와 배열의 길이를 반드시 명시해줘야 한다.
let arrFrom2 = Array.from({
    // 인덱스 번호
    0: 1,
    1: 2,
    // 배열 길이
    length: 2,
})

console.log(arrFrom2); // [1, 2]


// 대괄호

let arr = [2, 5, 9];

console.log(arr); // [2, 5, 9]

 

 

▶ 아이템 참조하는 방법

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol[0]);  // 가렌
console.log(lol[1]);  // 럭스
console.log(lol[2]);  // 카타리나

// 총 아이템의 갯수를 나타내준다.
console.log(lol.length); // 3

 

 

▶ 아이템 추가, 삭제 방법(좋지 않은 방식이다)

 

let lol = ['가렌', '럭스', '카타리나'];

lol[3] = '갈리오'; // 새로운 아이템 추가
console.log(lol); // ['가렌', '럭스', '카타리나', '갈리오'];

lol[2] = '넬'; // 기존의 아이템 덮어씌움
console.log(lol); // ['가렌', '럭스', '넬', '갈리오'];

delete lol[1]; // 1번 인덱스의 아이템 지움
console.log(lol);  // [ '가렌', <1 empty item>, '넬', '갈리오' ] => 비어있는 칸이 존재하기 때문에 좋은방식이 아니다.

 

 

▶ Array.isArry = > 배열인지 아닌지 판단한다.

 

let lol = ['가렌', '럭스', '카타리나'];
let lol2 = {
    name: '가렌',
    age: '33',
};

console.log(Array.isArray(lol));  // true
console.log(Array.isArray(lol2));  // fasle => 배열이 아님

 

 

▶ indexOf => 아이템이 몇번 인덱스에 있는지 알려준다.

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.indexOf('럭스'));  // 1

 

 

▶ includes => 아이템이 있는지 없는지 판단한다.

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.includes('카타리나'));  // true
console.log(lol.includes('미스포춘'));  // false

 

 

▶ unshift => 배열의 맨 앞의 아이템을 추가한다.(아이템 추가 후에 배열의 길이를 반환해준다)

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.unshift('다리우스'));  // 4 => 아이템 추가 후에 배열의 길이 반환
console.log(lol);  // [ '다리우스', '가렌', '럭스', '카타리나' ]

 

 

▶ push => 배열의 맨 뒤의 아이템을 추가한다.(아이템 추가 후에 배열의 길이를 반환해준다)

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.push('다리우스'));  // 4 => 아이템 추가 후에 배열의 길이 반환
console.log(lol);  // [ '가렌', '럭스', '카타리나', '다리우스' ]

 

▶  shift => 배열의 맨 앞의 아이템을 없앤다.(삭제한 아이템을 반환해준다)

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.shift());  // 가렌
console.log(lol);  // [ '럭스', '카타리나' ]

 

 

▶ pop => 배열의 맨 뒤의 아이템을 없앤다.(삭제한 아이템을 반환해준다)

 

let lol = ['가렌', '럭스', '카타리나'];

console.log(lol.pop());  // 카타리나
console.log(lol);  // [ '가렌', '럭스' ]

 

 

▶ splice => 범위를 정해서 아이템을 추가, 삭제할수 있다.

 

let lol = ['가렌', '럭스', '카타리나', '갈리오'];

// 0번째 인덱스부터 삭제를 시작하고, 총 2개의 인덱스를 삭제한다.
console.log(lol.splice(0, 2));  // [ '가렌', '럭스' ] => 삭제된 인덱스 반환
console.log(lol);  // [ '카타리나', '갈리오' ] => 살아남은 아이템

// 살아남은 아이템 [ '카타리나', '갈리오' ] 중에서 1번 인덱스부터 삭제 시작, 1개의 인덱스 삭제 후 '미스포춘', '알리스타' 아이템을 추가한다.
console.log(lol.splice(1, 1, '미스포춘', '알리스타')); // [ '갈리오' ]
console.log(lol);  // [ '카타리나', '미스포춘', '알리스타' ]