본문 바로가기

문돌이 존버/Node.js 스터디

(Node.js) 자바스크립트 반복문 및 Array 특성 feat. 생활코딩

반응형
본 글은 생활코딩의 Node.js 강의를 보고 정리한 것입니다.

이번 시간에는 자바스크립트 반복문을 살펴보겠습니다. 파이썬과 마찬가지로 for, while 문이 있었는데 형식은 조금 차이가 있었습니다.

for 문에선 변수, 종료 조건, 반복 조건 등을 모두 괄호 안에 넣은 반면, while 문은 파이썬과 비슷하게 종료 조건만 괄호 안에 넣었습니다.

for (var i = 0, i < 2; i++) {
  console.log(i);
}

var i = 0;
while (i < 2) {
    i += 1;
    console.log(i);
}

자료 구조 어레이(array)는 어디에서나 비슷할 것으로 예상이 되는데요. 다만, push, pop 등의 메서드명이나 기능들이 조금씩 차이가 나는 것 같습니다.

var arr = ['A', 'B', 'C', 'D'];
console.log(arr.length);

먼저 원소를 추가하는 함수들입니다.

// 마지막에 원소 추가
arr.push('E');

// 맨 앞에 원소 추가
arr.unshift('Z');

// 원하는 위치에 원소 추가
arr.splice(2, 0, 'Z') // index 2 위치에 원소 추가
arr.splice(2, 0, 'E', 'F'); // 원소 2개 추가

다음은 원소를 제거하는 함수들입니다.

// 마지막 원소 제거
arr.pop();

// 첫 번째 원소 제거
arr.shift();

// index n부터 m개 요소 제거
arr.splice(2, 1); // index 2부터 1개의 요소 제거

// 값은 삭제되고 요소는 존재
delete arr[1]

위에서 delete 는 조금 흥미로웠는데, 그 결과값을 보면 아래와 같습니다.

말 그대로 'B' 라는 값은 삭제되었지만 요소 자체가 지워진 것은 아닙니다.

위와 같은 함수를 사용하지 않고 어레이의 원소를 추가하거나 삭제하는 또 다른 방법이 있었고, 이 역시 파이썬과 달라 흥미로웠습니다.

var arr = ['A', 'B', 'C', 'D'];

// 원소 추가 1
arr[arr.length] = 'E'

// 원소 추가 2
arr[6] = 'G';

// 원소 제거
arr.length = arr.length - 1;

<원소 추가 1>
<원소 추가 2>
<원소 제거>

원소를 추가할 때 어레이의 길이보다 더 큰 인덱스에 추가하면 기존에 존재하는 원소와 해당 인덱스 사이는 빈 공간이 생깁니다. 그리고 원소를 제거할 때 길이를 줄여버리면 뒤에서부터 원소가 제거된다는 사실도 확인할 수 있었습니다.

참고
https://gent.tistory.com/295
728x90
반응형