[JavaScript] Arrays

JavaScript 배열은 단일 변수에 여러 값을 저장하는데 사용됩니다. 

1.What is an Array?

배열은 한번에 둘 이상의 값을 저장할 수 있는 특수한 변수입니다.

배열은 하나의 이름으로 여러값을 가질 수 있으며 인덱스 번호를 참조하여 값에 접근할 수 있습니다. 

2.Creating an Array

배열 리터럴을 사용하는 것이 JavaScript 배열을 만드는 가장 쉬운 방법입니다. 

[배열 리터럴 : 대괄호 안에 쉼표로 구분해 나열한 것.]

example)

var array_name = [item1, item2, ...]; // Good

var array_name = new Array(item1, item2, ...); // Bad

위의 두 예제는 완전히 동일합니다.

JavaScript의 기본 제공 배열 생성자인 new Array()를 사용할 필요가 없습니다.

단순성, 가독성 및 실행속도를 위해 첫번째(the array literal method)를 사용하십시오. 

new 키워드는 코드를 복잡하게 하며 예기치 않은 결과를 발생할 수 있습니다.

example)

var points = new Array(40, 100); // Create an array with two elements(40 and 100)

var points = new Array(40); // Creates an array with 40 undefined elements!

3.Access the Elements of an Array

인덱스 번호를 참조하여 배열 요소에 접근합니다.

배열 인덱스는 0부터 시작합니다. 

example) var name = array_name[0];

배열 인덱스를 이용하여 해당 인덱스에 위치한 요소값을 변경할 수 있습니다. 

또한 배열 이름을 참조하여 전체 배열에 접근할 수 있습니다.

4.Arrays are Objects

배열은 특별한 유형의 객체입니다. 

JavaScript의 typeof 연산자는 배열의 "object"를 반환합니다.

배열은 숫자를 사용하여 "요소"에 접근합니다.

객체는 이름을 사용하여 "멤버"에 접근합니다.

배열 요소가 객체가 될 수 있습니다.

JavaScript 변수는 객체가 될 수 있습니다. 

배열은 특별한 종류의 객체입니다.

그러므로 동일한 배열에서 여러 유형의 변수를 가질 수 있습니다.

배열에 객체/함수/배열 을 가질 수 있습니다.

>>>배열 메서드

1.The length Property

배열의 length 속성은 배열의 길이(배열 요소의 수)를 반환합니다. 

length 속성은 항상 가장 높은 배열 인덱스보다 하나 더 큽니다. 

example)

var first = fruits[0]; // 첫번째 배열 요소 접근

var last = fruits[fruits.length - 1]; // 마지막 배열 요소 접근

2.Looping Array Elements

배열을 반복하는 가장 안전한 방법은 "for"루프를 사용하는 것입니다.

example)

for(i = 0; i < fruits.length; i++){ console.log(fruits[i]) };

fruits.forEach(function(value) { cosole.log(fruits[i]) });

3.Adding Array Elements

새 요소를 배열에 추가하는 가장 쉬운 방법은 push 메서드를 사용하는 것입니다. 

example) fruits.push("Lemon");

배열이 가지고 있는 index(max, length -1) 보다 높은 인덱스를 가진 요소를 추가하면 배열에 정의되지 않은 구명이 생길 수 있습니다.

4.연관 배열

많은 프로그래밍 언어는 명명된 인덱스를 사용하여 배열을 지원합니다.

명명된 인덱스가 있는 배열을 연관 배열(or hashes)이라고 합니다.

JavaScript는 명명된 인덱스가 있는 배열을 지원하지 않습니다.

JavaScript에서 배열은 항상 번호가 매겨진 인덱스를 사용합니다.

명명된 인덱스를 사용하면 JavaScript가 배열을 표준객체로 다시 정의합니다.

그런 다음 일부 배열 메서드 및 속성은 잘목된 결과를 생성합니다.

example1)

var person = [];

person[0] = "John";

person[1] = "Doe";

person[2] = 46;

var x = person.length; // return 3

var y = person[0] // return "John"

example2)

var person = [];

person["firstName"] = "John";

person["lastName"] = "Doe";

person["age"] = 46;

var x = person.length; // return 0

var y = person[0] // return undefined

5.배열과 객체의 차이점

JavaScript에서 배열은 번호가 매겨진 인덱스를 사용합니다.

JavaScript에서 객체는 번호가 매겨진 인덱스를 사용합니다.

배열은 번호가 매겨진 인덱스가 있는 특별한 종류의 객체입니다.

6.배열을 사용해야 하는 경우, 객체를 사용해야하는 경우

자바스크립트는 연관 배열을 지원하지 않습니다.

요소 이름을 문자열(text)로 만들려면 객체를 사용해야 합니다.

요소 이름을 숫자로 만들려면 배열을 사용해야 합니다.

7. 배열을 인식하는 방법

>>>변수가 배열인지 어떻게 알 수 있습니까?

문제는 JavaScript 연산자 typeof가 "object"를 반환한다는 것입니다.

typeof 연산자는 JavaScript 배열이 객체이기 때문에 "object"를 반환합니다. 

example)

var fruits = ["Banana", "Orange", "Apple", "Mango"]

typeof fruits; // return object

Solution 1

ECMAScript 5에서는 Array.isArray()라는 새 메서드를 정의합니다.

example)

Array.isArray(fruits); // return true

Solution 2

자신만의 isArray() 함수를 만들 수 있습니다.

인수가 배열이면 항상 true를 반환합니다.

즉, 객체 프로트 타입에 "Array"라는 단어가 포함되어 있으면 true를 반환합니다.

example)

function isArray(x) { return x.constructor.toString().indexOf("Array") > -1;}

Solution 3

주어진 생성자(constructor)에 의해 생성되는 경우 instanceof 연산자는 true를 반환합니다.

example)

var fruits = ["Banana", "Orange", "Apple", "Mango"]

fruits instanceof Array // return ture