JavaScript - 배열의 특징과 생성

JS에서의 배열은 타 언어와 다르다.

 

타 배열의 요소 크기는 고정되어 있다. 선언 시 설정 가능

JS는 한 배열에 여러 종류의 자료형이 요소 값으로 올 수 있다.

 

굳이 비교하자면 Array List 자료형에 더 가깝다.

 

다른 언어들의 배열 전형적인 배열

 

1.한 배열에는 같은 자료형의 데이터만 포함 가능

2.데이터의 메모리 주소가 연속으로 나열됨

3.접근은 빠름, 중간요소의 추가나 제거는 느림

 

---

자바스크립트의 배열

⭐️ 배열의 형태와 동작을 흉내내는 특수 객체

한 배열에 다양한 자료형의 데이터가 들어갈 수 있음

 

연속나열이 아님 - 💡 엔진에 따라 요소들의 타입이 동일하면 연속 배열하기도...

 

접근은 상대적으로 느림 (일반 객체보다는 빠름), 중간요소의 추가나 제거는 빠름

 

특정 자료형만 담는 배열도 존재 하긴 함

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects#indexed_collections

 

💡 특정 자료형 전용 배열도 있음 - 더 빠름  MDN 문서 보기

---

배열의 생성

 

 

생성자 함수 사용시 인자 값으로 길이 설정

요소는 비어있는 채로 선언된다.

 

 

인자 값으로 둘 이상의 요소를 넣을 시 해당 값을 요소로 배열 생성 됨

 

 

배열 생성시 사용되는 메서드

of 정적 메서드

of 메서드 사용 시 숫자 하나 라도 그 요소로 배열 생성 -> 인자값을 배열의 요소로 지정

 

 

 

 

 

from 정적 메서드

배열, 문자열, 객체 등 유사 배열 객체의 요소를 이용하여 배열로 생성할 수 있는 기능

 

💡 유사배열객체: length와 인덱싱 프로퍼티를 가진 객체

배열 만 가질 수 있는 메서드 ( push, pop, slice, forEach) 는 포함 x

 

 

 

이터러블

객체차체로 for문 순회 불가 ( 객체는 이터러블 x )

 

객체를 배열로 바꾸어 이터러블 하게 만든 후 for문 순회

from 메서드 사용시 배열은 그대로 복사됨 ( 얕은 복사 )

 

얕은 복사를 이용할 시 원시값은 깊은 복사와 마찬가지로 복사됨

참조값일 경우는 얕은 복사가 이루어져 같은 곳을 참조함

원시값의 얕은 복사

참조형의 얕은 복사 -> 두 객체 모두 수정되었음

---

유사 배열 객체 

argument 객체, DOM메서드 반환 값, 문자열 String 등

 

마치 배열 처럼보이지만, 실제로는 배열이 아닌 객체

 

인덱스 속성: 유사 배열 객체는 인덱스를 키로 사용하여 요소를 저장합니다. 예를 들어, obj[0], obj[1] 등의 형태로 요소에 접근할 수 있습니다.

 

길이 속성(length): 유사 배열 객체는 length 속성을 가지고 있어, 객체 내의 요소 개수를 나타냅니다. 예를 들어, 객체에 세 개의 요소가 있다면 obj.length는 3이 됩니다.

 

배열 메서드 미포함: 일반 배열의 내장 메서드들(push, pop, slice, forEach 등)은 유사 배열 객체에 기본적으로 존재하지 않습니다. 그러나 이러한 메서드를 Array.prototype을 사용하여 유사 배열 객체에 적용시킬 수는 있습니다.

 

 

JS의 문자열도 유사 배열 객체인가 ?

네, JavaScript에서 문자열은 어느 정도 유사 배열 객체(Array-like object)의 성질을 가지고 있습니다. 문자열이 유사 배열 객체로 간주되는 이유는 다음과 같은 특성 때문입니다:

 

인덱스를 통한 접근: 문자열에서 각 문자에 인덱스를 사용하여 접근할 수 있습니다. 예를 들어, 문자열 var str = "hello"에서 str[0]은 'h'를 반환합니다.

 

길이 속성(length): 문자열은 length 속성을 가지고 있어, 문자열의 길이를 나타냅니다. 예를 들어, "hello".length는 5입니다.

 

배열 메서드 미적용: 문자열은 배열이 아니므로, 배열의 메서드(push, pop, slice, forEach 등)를 직접 사용할 수 없습니다. 그러나 일부 메서드(예: slice)는 문자열에 대한 유사한 동작을 제공합니다.

 

그러나 문자열과 일반 유사 배열 객체 사이에는 중요한 차이점이 있습니다:

 

불변성(Immutability): JavaScript의 문자열은 불변 객체입니다. 즉, 문자열의 개별 문자를 변경할 수 없습니다. 예를 들어, str[0] = 'H'와 같은 코드는 str 문자열을 변경하지 않습니다. 이는 일반적인 유사 배열 객체와는 다른 중요한 특징입니다.

때문에 문자열은 유사 배열 객체의 특성을 일부 가지고 있지만, 불변성과 같은 고유한 특성 때문에 일반적인 유사 배열 객체와는 구분되어야 합니다. 문자열을 배열처럼 사용하고자 할 때는 이러한 차이점을 고려해야 합니다. 예를 들어, 문자열을 배열로 변환하려면 Array.from() 함수나 스프레드 문법(...)을 사용할 수 있으며, 이렇게 변환된 배열에서는 문자열을 변경하고 조작할 수 있습니다.