2-1 배열

📌이번에는 배열에 대해 알아보자

---

📌배열이란 뭘까?

💡 배열이란 번호와 번호에 대응하는 데이터들로 이루어진 자료 구조를 말한다.

JS에서 배열은 타입이 엄격한 다른 언어들과 달리 문자열, 숫자, 객체 심지어 다른 배열이나 어떤 타입의 값이라도 담을 수 있다.

---

💻 code

var a = [ 1, "2", [3]];

a.length// 3
a[0] === 1; // true
a[2][0] ===3; //true

---

배열의 크기는 미리 정하지 않고 선언할 수 있고 원하는 값을 추가하면 된다.

---

💻 code

var a = [];
a.length // 0
a[0] = 1;
a[1] = "2";
a[2] = [3];
a.length // 3

---

배열의 인덱스는 숫자인데 JS에서 배열은 객체의 하위 타입이므로 키/프로퍼티 문자열을 추가할 수 있다.
이때 배열의 length는 증가하지 않는다.

---

💻 code

var a = [];

a[0] = 1;
a["foobar"] = 2;

a.length; //1
a["foobar"] // 2
a.foobar // 2

---

🔥이때 키로 넣은 문자열 값이 표준 10진수 숫자로 타입이 바뀌면, 마치 문자열이 아닌 숫자키를 사용한 것 같은 결과가 나오는 것을 주의 해야한다.

---

💻 code

var a = [];
a["13"] = 42;
a.length// 14

---

따라서 우리는 가급적으로 배열에 문자열 타입의 키/프로퍼티를 사용하지 말자!

📌유사 배열?

가끔 코딩을 하다보면 숫자 인덱스가 가르키는 값들을 진짜 배열로 바꾸고 싶을 때가 있다.
이럴때는 배열 유틸리티 함수를 사용하는 것이 일반적이다.

• indexOf()
• concat()
• forEach()

---

💻 code

function foo(){
  var arr = Array.prototype.slice.call(arguments);
  arr.push("bam");
  console.log(arr);
}

foo("bar", "baz"); // ["bar", "baz", "bam"]

---

ES6부터는 기본 내장 함수 Array.from()이 이 일을 대신한다.

---

💻 code

var arr = Array.from(arguments);

---

🔥Array.from()에는 다른 강력한 기능이 있는데 이는 빈 배열을 초기화 시키는 것이다.

---

💻 code

Array.from(
  {length : 20}, 			//유사 배열
  () => Array(10).fill(0)	// 각각 배열 인덱스에 적용
);

---

위 코드는 0으로 초기화 된 20 X 10 배열을 return한다.
위와 같은 코드를 사용할 수 있는 것은 배열의 타입이 object이기 때문이다.

🚪 마치며

---

오늘은 JS의 특별한 배열에 대해 알아보았다.

다른 엄격한 언어들과 달리 자유로운 JS에서 배열은 여러 오류를 뿜어낼 수 있는 위험한 도구이다. 또한 다음 시간에 배울 문자열을 변경할때 유용한 도구로 작용할 수 있다. (문자열도 유사 배열이다!)

배열의 메서드와 특징은 잘 공부 해두자! 🔥🔥🔥