배열을 이용해보자

안녕하세요 요즘 자바스크립트 공부를 하면서 기초부터 다시 차근차근 정리하면서 배워나가고 있습니다.

오늘은 배열에 대해서 정리 해보도록 하겠습니다.

 

배열이란

배열은 요소를 한 묶음으로 값을 저장 할 수 있습니다.

 

const apple = '사과';

const grape = '포도';

const pear = '배'

 

값을 1개만 저장 하다 배열을 이용하면 한 묶음으로 저장 할 수 있습니다.

 

const fruits = ['사과','포도','배'];

배열에 안에 있는 값은 '요소'라고 부릅니다.

배열 요소에 접근하기 위해서는

fruits[0]

fruits[1] 

fruits[2] 

배열은 자릿수가 0부터 시작하며, 이를 인덱스라고도 합니다.

const fruits = ['사과','포도','배']에서 '사과'는 0번째 인덱스 라고 합니다.

또한, 3개의 요소가 있다고 합니다.

 

배열의 길이 알기

fruits.length를 이용하면 길이를 알 수 있습니다.

 

첫번째 배열의 요소 및 맨 마지막 요소 알기 위한 방법.

fruits[0] - 첫번째 요소 알기

fruits[fruist.length-1]- 맨 마지막 요소 알기

 

배열의 첫번째 및 마지막에 요소 추가하는 방법

 

만약 첫번째 배열의 요소 값을 바꾸기 위해서 fruits[0] = '##'를 하게 되면 수정되는 현상이 발생합니다.

값이 새롭게 추가 되는 것이 아니라(수박-> 복숭아) 수정이 됩니다.

fruits.unshift('##') - 한글,영어

fruits.unshift($$) -숫자를 추가 하면 배열에 0번째 인덱스에 추가할 수 있습니다.

 

fruits.push('##') - 한글,영어

fruits.push($$)- 숫자를 이용하면 맨 뒤에 추가할 수 있습니다.

또한, 다른 방법으로 fruits[fruits.length] = '' 방법으로도 맨 마지막에 추가 할 수 있습니다.

 

퀴즈: 포도를 콘솔창에 찾아보세요.

 

포도 찾기

fruits[2] 방법으로 찾을 수 있고 fruits[fruits.length-4]를 이용해서 찾을 수도 있습니다.

 

배열의 맨 앞의 요소 / 맨 뒤의 요소 제거 하는 방법

pop() , shift()

fruits.shift();를 이용하면 배열의 맨 첫번째 요소를 삭제 할 수 있다,

fruits.pop();를 이용하면 배열의 맨 마지막 요소를 삭제 할 수 있다.

배열의 중간 값을 제거 하는 방법

target.splice(지우고 싶은 해당 인덱스, 몇개를 지우고 싶은지 );

 

총 7개의 요소가 있을 경우 '2'의 요소부터 6싸지 지우고 싶을 경우

1번째 인데스부터 5개까지 지우겠다 splice(1,5);를 입력하여

해당 중간 값을 지울 수 있다.

 

만약 splice(인덱스의 값)만 입력 했을 경우 그 이후의 요소들은 다 삭제 된다.

const 배열의 다른점

const를 선언한 후 다시 재선언 할 경우 오류가 발생하지만 , 내부의 값을 변경 할 때는 문제가 없는 것을 확인 할 수 있습니다.