[JavaScript]배열 size()와 length의 차이

JavaScript에서 배열(Array)의 size()와 length의 차이를 정리합니다.

---

특정 브라우저에서만 호환되는 size()

.size() 메서드는 jQuery 1.8부터 사용되지 않습니다.

jQuery 1.8부터 .size() 메소드가 삭제되었으므로 .length property를 사용할 것을 권고하고 있습니다.

 

특정 브라우저에서 .size() 메서드가 동작하는 이유는 jQuery 버전이 1.8 미만이기 때문입니다.

참조 : https://api.jquery.com/size/

---

size() 메서드는 순수 배열의 메서드가 아닙니다.

size() 메서드는 jQuery에서 지원하는 라이브러리입니다.

순수한 자바스크립트 방식이 아닙니다.

---

size()는 길이를 구하는데 적합하지 않습니다.

다른 프로그래밍 언어에서 size() 메소드는 메모리의 크기를 알고 싶을 때 사용합니다.

하지만, jQuery의 .size() 메서드는 메모리의 크기가 아니라 요소의 수를 반환합니다.

메서드의 이름 때문에 많은 혼란을 야기할 수 있습니다.

---

length 속성은 숫자 키가 있는 배열에 대해 (last_key + 1)을 반환합니다.

마지막 숫자 키가 11이므로 last_key = 11입니다.

arr.length = 11 + 1  = 12를 출력합니다.

var arr = new Array();
arr[10] = 10; 
arr[11] = 11;
console.log(arr.length);

배열의 요소가 전부 문자 키로 되어 있는 경우 length 속성은 정상적을 동작하지 않습니다.

아래 코드의 출력 값은 0입니다.

var arr = new Array();
arr['A'] = 'A'; 
arr['C'] = 'C';
console.log(arr.length);

배열의 요소가 문자와 숫자로 혼합되어 있을 경우 숫자로 되어 있는 경우입니다.

length 속성은 마지막 숫자 키의 + 1을 반환합니다.

arr1.length도 11을 반환하고 arr2.length도 11을 반환합니다.

var arr1 = new Array();
arr1[10] = 'A'; 
arr1['C'] = 'C';
console.log(arr1.length);

var arr2 = new Array();
arr2['C'] = 'C';
arr2[10] = 'A'; 
console.log(arr2.length);

---

즉, length는 배열의 요소 수를 반환하는 것이 아닙니다.

위에서 length 속성이 last_key + 1을 반환하는 것을 확인하였습니다.

아래 코드에서 요소를 3개로 선언을 하였고 index 100에 '100'을 대입하였습니다.

a의 last_key는 100이므로 a.length는 101을 반환합니다.

var a = ['1', '2', '3'];
a[100] = '100';
console.log(a.length);

---

참고

http://daplus.net/javascript-array-size-%EB%8C%80-array-length/

[javascript] Array.size () 대 Array.length - 리뷰나라

https://stackoverflow.com/questions/14202601/array-size-vs-array-length

Array.size() vs Array.length