new Array() vs []

javascript에서 배열을 생성하는 방법 2가지

1. 객체를 이용한 선언 let arr = new Array()
2. 객체 리터럴을 이용한 선언 let arr = []

두 가지 방법은 큰 차이가 없으나 약간의 성능 차이와 직관성에서 차이가 있다.

예를 들어 new Array()의 경우

let arr = new Array(5); // 숫자 하나의 경우 배열의 크기를 선언
console.log(arr) // [empty × 5]  arr.length : 5

let arr = new Array(1,2,3,4,5) // 괄호에 입력한 값으로 배열을 초기화
console.log(arr) // [1, 2, 3, 4, 5]  arr.length : 5

//속도 아래의 반복문 20번 실행했을 경우
console.time('new Array()')
for(var i=0;i<1000000;i++){
    var arr = new Array();
}
console.timeEnd('new Array()')
//최저 
new Array(): 7.534912109375 ms
//최고
new Array(): 16.245849609375 ms
//평균
new Array(): 10.63 ms

[]의 경우

let arr = [5] // []로 배열을 선언하는 경우 숫자의 갯수에 관계없이 입력한 값으로 배열을 초기화
console.log(arr) // [5]

let arr = [1,2,3,4,5]
console.log(arr) // [1, 2, 3, 4, 5]

//속도
console.time('[]')
for(var i=0;i<1000000;i++){
    var arr2 = [];
}
console.timeEnd('[]')
//최저
[]: 6.238037109375 ms
//최고
[]: 14.4111328125 ms
//평균 소수점 2째자리 까지 계산
[] : 8.131 ms

100만번의 배열을 생성할때는 이러한 차이를 보이고 있다. 속도면에서 객체 리터럴[]로 선언하는 것이 평균적으로 빠르다는 것을 확인 할 수 있다. 이 정도 차이면 상관없지않나? 싶을 수도 있지만 속도뿐만이 아니라 가독성적인 측면에서도 배열은 []로 선언하는 것이 좋을 것 같다!

번외로 new Object와 {}의 차이도 비교해보자면

//{}로 선언
var obj = {}
console.log(obj) // {}
//속도
console.time('{}')
for(var i=0;i<1000000;i++){
    var object = {};
}
console.timeEnd('{}')
//최고 {}: 13.163818359375 ms
//최저 {}: 6.73583984375 ms
//평균 {}: 9.48 ms

//new Object()로 선언
var obj2 = new Object()
console.log(obj2) // {}
//속도
console.time('new Object()')
for(var i=0;i<1000000;i++){
    var object = new Object();
}
console.timeEnd('new Object()')
//최고 new Object(): 12.26806640625 ms
//최저 new Object(): 7.239990234375 ms
//평균 new Object(): 9.37 ms

표본이 적어서인지 정말 근소한 차이로 new Object가 조금 더 빠르게 나왔다. 구글링을 해봤을 때는 Object또한 객체 리터럴 방식이 더 빠르다고 하는데 다음에 시간이 있을 때 다시 비교해보도록 하고, Object를 리터럴 방식으로 선언해야하는 이유는 배열과 동일한 이유로 가독성이 있고, 또 오버라이딩의 위험성 때문이라고 한다. 하지만 이번에 테스트를 해봤을 때 아래와 같은 결과가 나왔다

let a = new Object();
console.log(a) // {}

Object = "fool"
let a = new Object() // Uncaught TypeError: Object is not a constructor

Object를 변수로 선언했기 때문에 생성자가 아니라는 TypeError가 나왔다. 실수로 Obejct를 변수명으로 사용하지는 않겠지만 혹시 사용하게 되어 TypeError를 만날 수 있으니 {} 객체 리터럴 방식으로 선언하는 것이 조금 더 좋아보인다!