Javascript 배열의 개념 정리

안녕하세요! 오늘은 Javascript의 배열들에 대해 알아보겠습니다!

( H태그를 활용해서 내용에 적으면 우측에 편하게 섹션처럼 생기더라구요...!
밸린이라서 이제 아는 바람에 이제부터라도 열심히 사용하겠습니다..!) (에헴...)

알아볼 배열의 종류

• push
• pop
• shift
• unshift
• splice
• slice

많아 보일 수 있지만 제가 최대한 쉽게 설명드리겠습니다! 가시죠!

---

push

-> 배열 끝에 요소 추가해주기

let fruits = ['사과', '바나나'];
fruits.push('오렌지');
console.log(fruits);
// 콘솔결과: ["사과", "바나나", "오렌지"]

push는 배열 끝에 추가를 해줄 수 있기 때문에

["사과", "바나나", "오렌지"]
위와 같은 결과를 얻을 수 있습니다

---

pop

-> 배열의 마지막 요소가 팝! 하고 사라지기

let fruits = ['사과', '바나나'];
fruits.pop();
console.log(fruits);
// 콘솔결과: ["사과"]

pop은 배열의 마지막 요소를 삭제해줄 수 있기 때문에

["사과"]
위와 같은 결과를 얻을 수 있습니다

---

shift

-> 배열의 맨 앞 요소가 쉬프트! 하고 없어지기

let fruits = ['사과', '바나나'];
fruits.shift();
console.log(fruits);

shift는 배열의 맨 앞 요소를 삭제해줄 수 있기 때문에

["바나나"]
위와 같은 결과를 얻을 수 있습니다

---

unshift

-> 배열의 맨 앞에 요소가 붙습니다 (shift와 반대)

let fruits = ['사과', '바나나'];
fruits.unshift('포도');
console.log(fruits);

unshift는 배열의 맨 앞에 요소를 추가할 수 있기 때문에

["포도", "사과", "바나나"]
위와 같은 결과를 얻을 수 있습니다

---

splice

-> n번째 요소부터 n번째 요소를 삭제하고 삭제한 자리에 요소를 갈아낄 수 있습니다

let fruits = ['사과', '바나나', '키위'];
fruits.splice(1, 1, '포도');
console.log(fruits);

splice는 요소를 삭제하고 갈아낄 수 있기 때문에
위의 코드처럼 첫 번째 요소부터 첫 번째 요소를 삭제하고 '포도' 요소를 넣어줘
라고 해석할 수 있습니다
그렇기 때문에

["사과", "포도", "키위"]
위와 같은 결과를 얻을 수 있습니다

---

slice

-> n번째 요소부터 n번째 요소까지만 자르겠습니다

let fruits = ['사과', '바나나', '키위'];
let slicedFruits = fruits.slice(1, 3);
console.log(slicedFruits)

slice는 요소를 설정한 범위 만큼한 출력할 수 있기 때문에
위의 코드처럼 1번째 부터 3번째 안에 있는 요소들만 뽑겠습니다
라고 해석할 수 있습니다
그렇기 때문에

["바나나", "키위"]
위와 같은 결과를 얻을 수 있습니다

---

어때요! 쉽죠...?

흔한 배열의 종류들이라서 익숙하신 분들도 계실 것이고,
어색하신 분들도 계실 것 같습니다

저도 처음에는 많이 어색했습니다 물론 다 알고 있는 것도 아니구요,,,ㅎ
그래도 계속 많이 키보드를 두드려 보니깐 처음보다는 아~~~주 조금 알 것 같드라구요
저도 아직 많이 부족합니다..ㅎ

그러니깐 우리 모두 계속 즐겁게 공부해서 끝까지 가보자구요!

오늘도 저의 TIL을 봐주셔서 감사합니다
아직 코딩에 대해 공부를 하고 있는 과정이기 때문에
저의 정보가 정확하지 않을 수 있습니다 혹시 틀리거나 보충이 필요한 부분에 대해서는
언제든지 편하게 댓글 달아주시면 정말 감사할 것 같습니다 :)

그럼, 오늘도 좋은 하루 보내시구요! 항상 자신감을 잃지 말고 꿈을 향해 달려가자구요..!
인생은 장거리 달리기! 아자아자!!👍🏻