배열 다루기

let members = ['쿤갈레','Zerrard66','우리생각해써','흙토끼','End Miracle'];

javascript는 거의 모든 것이 객체라고 하지만 사실 배열도 객체이다.
typeof 연산자로 이 배열의 자료형을 한번 확인해보자.

console.log(typeof members);
// object 출력

배열이 객체인 만큼 배열에 요소를 추가,수정하는 것도 객체와 비슷하다.

console.log(members[5]);
// 존재하지 않는 요소에 접근하려 하면 undefined 출력

members[5] = 'NiceCodeit';
console.log(members[5]);

이미 존재하는 요소에 접근해서 값을 할당하게 되면 요소의 값이 수정되는 방식이다.
memebers의 length도 6으로 증가된다.

주의할 점
인덱스의 순서를 뛰어넘으면서 추가하게 되면
undefined 값이 들어간 요소가 자동으로 생성된다.

members[6] = 'NiceCodeit';
console.log(members[5]);

콘솔창에서 확인 시
'쿤갈레','Zerrard66','우리생각해써','흙토끼','End Miracle', empty, 'NiceCodeit' 출력된다.
memebers의 length도 7으로 증가된다.

delete members[4];

delete 연산자를 활용하면 값 자체는 지워졌지만 요소가 계속 empty로 남아 있다.
사실상 완벽하게 요소가 삭제되었다고 보기는 조금 힘들다.

배열의 요소를 완벽하게 삭제하려면 배열이 가지고 있는 메소드를 활용해야 한다.

배열의 요소를 삭제할 때 가장 많이 사용되는 메소드는 splice라는 메소드이다.

members.splice(4);
console.log(members);
// 4번 인덱스의 값이 아예 삭제된다. length도 줄어든다.

하지만

members.splice(1);
console.log(members);

1번 인덱스를 삭제하고 싶어서 파라미터로 1을 전달해 주면 1번 인덱스 이후에 모든 요소를 삭제해버린다.
이때 splice 메소드의 두 번째 파라미터로 숫자 값을 하나 더 전달해 주면 삭제할 개수를 조절할 수 있다.

members.splice(1, 2);
console.log(members);
// 1번 인덱스부터 요소 두 개가 삭제된다

splice 메소드의 세 번째 파라미터는 값을 전달하게 되면 삭제한 요소 자리에 그 값이 추가가 된다.

members.splice(1, 1, 'NiceCodeit', 'HiCodeit');
console.log(members);
// 1번 인덱스부터 요소 하나를 삭제하고 그 자리에 'NiceCodeit', 'HiCodeit'을 추가하게 된다.
// 나머지 부분들은 순서가 하나씩 밀리게 된다.

splice 메소드에서 삭제할 개수를 0으로 만들어 주면

members.splice(1, 0, 'NiceCodeit', 'HiCodeit');
console.log(members);

첫 번째와 세 번째 파라미터로 이후의파라미터로 배열 안에 어느 곳에서든 요소를 추가할 수 있다.
삭제할 개수만큼 세 번째 이후에 파라미터를 활용하면 요소를 수정하는 것도 가능하다.