TIL - 20220702

 오늘은 모던 JavaScript 튜토리얼에서 배열(https://ko.javascript.info/array)에 대해 공부했다. 배열을 공부하며 다음과 같은 질문들을 작성했다.

모던 JavaScript 튜토리얼 5.4 배열을 읽고 만든 질문

 객체와 배열의 가장 큰 차이점은 객체에는 순서가 없고, 배열에는 순서가 있다는 점이다. 그래서, 어떠한 정보들을 저장할 때, 순서를 고려해야 한다면 배열, 상관없다면 객체를 사용하면 된다.

 

 배열을 사용해 만들 수 있는 대표적인 자료구조는 큐가 있으며 스택 또한 만들 수 있다. 큐는 선입선출(FIFO), 스택은 후입 선출(LIFO)인데, 배열 가장 마지막 순서에 요소를 넣어줄 때, push. 빼줄 때, pop으로 스택 자료구조를 만들 수 있고, 첫 번째 순서에 요소를 넣어주는 unshift, 빼주는 shift를 통해 큐를 구현할 수 있다. 하지만, shift와 unshift를 무분별하게 사용하면 안된다. shift와 unshift는 첫 번째 순서에 요소를 넣어주고 빼주는 것이기 때문에 연산을 하게 되면 그 뒤에 있는 모든 요소들이 한 칸씩 이동하거나 한 칸씩 뒤로 가야하고 이렇게 함으로써 메모리 연산이 많아지기 때문이다.  

 

let fruits = [];

fruits[9999] = 1;

fruits.age = 25;

 다음과 같이 작성한다고 해서, 당장 에러를 볼 수 있는 문제가 생기는 것은 아니다. 하지만, 자바스크립트 엔진은 배열을 다룰 때 사용하는 최적화 기법이 있어서 위와 같이 만들면 배열로 다루는 것이 아닌 객체처럼 다루기 때문에 자바스크립트 엔진이 배열을 다룰 때 사용하는 최적화 기법을 사용하지 못하게 되어 배열 특유의 이점을 누릴 수 없게 된다. 배열을 잘못 사용하게 되는 예는 다음과 같다.

 

arr.test = 5 // 숫자가 아닌 값을 프로퍼티의 키로 사용한 경우
arr[0], arr[10] // 처음과 끝만 있고 그 사이에 있는 요소들인 arr[1] ~ arr[9]를 채우지 않은 경우
arr[10], arr[9] // 요소들을 역순으로 채운 경우

  JavaScript를 매일 사용하지만, 모던 JavaScript 튜토리얼을 볼 때마다 내가 모르고 있던 부분, 기억하지 못하고 있던 부분들이 항상 존재한다. 주말, 시간 날 때마다 틈틈이 읽어야겠다.