SEB/FE - 220510

애리·2022년 5월 12일

Section 1

목록 보기
8/14
post-thumbnail

📌 배열

1. 배열

순서(index)가 있는 값(요소, element)으로 1개의 변수에 여러 개의 값을 순차적으로 저장할 때 사용한다. 첫번째 요소는 index ‘0’으로 간주하며 존재하지 않는 요소에 접근하면 undefined를 반환한다.


2. 배열 메소드 (arr = 배열이라 지칭)

2-1. 배열 확인

  • arr.length : 배열의 index의 수 (배열의 길이)
  • arr.indexOf(element) : 요소가 배열 안에 있다면 어느 index에 위치하는지 확인하는 메소드 (없다면 -1을 출력)
  • arr.includes(element) : indexOf와 비슷하지만 존재여부만 파악가능(internet explorer에서는 호환되지 않음)
  • Array.isArray() : 배열인지 아닌지 판별하는 메소드 (boolean값으로 출력)
  • console.table(arr) : 표를 통해서 각 index와 value를 확인할 수 있다.

2-2. 요소 추가/제거

  • arr.push(element) : 배열의 끝에 element를 추가
  • arr.pop() :배열 마지막 값 삭제
  • arr.shift(element) : 가장 앞의 element를 삭제
  • arr.unshift(element) : 가장 앞에 element값 추가

2-3. 배열 변경

  • arr1.concat(arr2) : arr1과 arr2를 순서대로 요소를 합쳐 하나의 배열 생성

    ex) arr1 = ['a', 'b'] arr1.concat(1, [2, 3]) => ['a', 'b', 1, 2, 3]

  • arr.slice(start, end) : arr의 start부터 end 전까지의 배열 요소를 반환
  • arr.join() : 배열의 모든 요소를 연결해 하나의 문자열로 반환


for...of : 반복가능한 객체에 대해서 반복하고 각 개별 속성값에 대해 출력

for (let i of arr) {
  console.log(i); //arr안의 요소들이 출력된다.
}

2-4. immutable value

객체가 생성된 이후 그 상태를 변경할 수 없는 값을 의미한다. Javascript에서는 boolean, null, undefined, Number, String 이 대표적인 immutable value이다.
이를 제외한 대부분의 객체는 새로운 값을 다시 만들 필요없이 직접 변경이 가능한 mutable value이다.

배열의 경우 메소드를 통해 직접 배열을 변경한다.



마무리 😮


오늘은 배열에 대한 기초적인 개념부터 배열에서 사용되는 다양한 메서드를 살펴보았다. 배열은 자바스크립트에서 중요한 문법 중 하나라고 하니 여러 개념에 대해 정확히 알고 넘어가야 할 것 같았다. 게다가 오늘은 코플릿을 페어와 함께 풀어보는 시간이 주어졌는데 오늘 페어분께서 아쉽게도 사정이 있으셔서 같이 진행하지 못했다🥲 그래도 배열에 대해 문제를 풀다보니 좀 더 확실히 잡히는 개념도 있었고, 또 추가적으로 mdn을 통해 알아본 자료도 정리해보니 나름 배열에 대해 잘 이해한 날이 되었다. 내일 배우게 되는 객체 또한 중요한 자바스크립트의 개념 중 하나이니 오늘 예습 차원으로 읽어봐야겠다.

참고사이트

for..of..
immutable value
Array.prototype.concat
Array.prototype.slice
Array.prototype.join

profile
예비 프론트엔드 개발자

0개의 댓글