자바 스크립트 배열은 하나의 변수에 여러 값을 저장하는 데 사용된다.
배열을 표시
이 튜토리얼에서 우리는 내부 배열을 표시하는 스크립트를 사용합니다 <p> 와 요소 id="demo" :
예
<p id="demo"></p>
<script>
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
첫 번째 줄은 (스크립트) 배열라는 이름의 차를 만듭니다.
두 번째 줄은 가진 요소 "발견" id="demo" , 및 "displays" 의 배열 "innerHTML" 그것의를;
그것을 자신을 시도
배열을 생성하고 값을 할당 :
공백과 줄 바꿈은 중요하지 않습니다. 선언은 여러 줄에 걸쳐있을 수 있습니다 :
(같은 마지막 요소 뒤에 쉼표를 넣어하지 마십시오 "BMW" ).
효과는 브라우저에 일치하지 않습니다.
배열은 무엇입니까?
배열은 한 번에 두 개 이상의 값을 보유 할 수있는 특수 변수입니다.
당신이 (예를 들어 자동차 이름의 목록) 항목의 목록이있는 경우, 하나의 변수에 차를 저장하면 다음과 같을 수 있습니다 :
var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW";
그러나, 당신은 무엇을 자동차를 통해 루프를 원하는 특정 하나를 찾을 경우? 그리고 당신은하지 3 차 있지만 300을 가지고 어떤 경우?
용액을 배열이다!
배열은 하나의 이름으로 많은 값을 보유 할 수 있으며 인덱스 번호를 참조하여 값에 액세스 할 수 있습니다.
배열 만들기
배열 리터럴을 사용하여 자바 스크립트 배열을 생성 할 수있는 가장 쉬운 방법입니다.
통사론:
var array-name = [ item1 , item2 , ...];
예:
var cars = ["Saab", "Volvo", "BMW"];자바 스크립트 키워드 새로운 사용
다음 예제는 배열을 생성하고 값을 할당합니다 :
두 가지 예는 위의 동일 않습니다. 사용할 필요가 없습니다 new Array() .
단순성 가독성 실행 속도를 들어, 첫 번째 (배열 리터럴 방법)를 사용한다.
배열의 요소에 액세스
사용자는인덱스 번호를 참조하여, 배열 요소를 참조.
이 문은 자동차의 첫 번째 요소의 값에 액세스합니다 :
var
name = cars[0];
이 문은 자동차의 첫 번째 요소를 수정합니다 :
cars[0] = "Opel";
[0] 어레이의 첫 번째 요소이다. [1] 제이다. 배열 인덱스는 0으로 시작합니다.
당신은 하나의 배열에서 다른 개체를 가질 수있다
자바 스크립트의 변수는 객체가 될 수 있습니다. 배열은 객체의 특별한 종류이다.
이 때문에 같은 배열에서 서로 다른 유형의 변수를 가질 수 있습니다.
당신은 배열의 개체를 가질 수 있습니다. 당신은 배열의 기능을 할 수 있습니다. 당신은 배열의 배열을 할 수 있습니다 :
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
배열은 객체이다
배열은 물체의 특별한 유형이다. typeof 자바 스크립트의 연산자는 반환 "object" 배열을.
하지만, 자바 스크립트 배열은 최선의 배열로 설명되어 있습니다.
배열은 사용하는 numbers 는 액세스 할 "elements" . 이 예에서, person[0] 반환 John :
개체는 "회원"에 접근을 이름을 사용합니다. 이 예에서, Person.firstName에 반환 John :
배열 속성 및 메서드
자바 스크립트 배열의 실제 강도가 내장되어 배열 속성 및 방법 :
예
var x = cars.length;
// The length property returns the number of elements in cars
var y = cars.sort();
// The sort() method sort cars in alphabetical order
배열 방법은 다음 장에서 설명합니다.
길이 속성
length 배열의 속성은 배열 (배열 요소의 수)의 길이를 반환합니다.
예
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length; // the length of fruits is 4
»그것을 자신을 시도 길이 속성은 항상 가장 높은 배열 인덱스에 1을 더합니다.
배열 요소 추가
배열에 새 요소를 추가하는 가장 쉬운 방법은 푸시 방법을 사용하고 있습니다 :
예
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // adds a new element (Lemon) to fruits »그것을 자신을 시도 새로운 요소는 또한 사용 배열에 추가 할 수있는 length 속성 :
예
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits »그것을 자신을 시도 경고!
정의되지 않은 만들 수 있습니다 높은 인덱스 요소 추가 "holes" 배열을 :
예
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[10] = "Lemon"; // adds a new element (Lemon) to fruits »그것을 자신을 시도 배열 요소를 반복
하는을 사용하는 배열을 통해 루프 가장 좋은 방법 "for" 루프 :
예
var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
»그것을 자신을 시도 연관 배열
많은 프로그래밍 언어라는 인덱스 배열을 지원합니다.
라는 인덱스 배열은 연관 배열 (또는 해시)이라고합니다.
자바 스크립트라는 인덱스 배열을 지원하지 않습니다.
자바 스크립트에서 배열은 항상 번호가 인덱스를 사용합니다.
예
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;
// person.length will return 3
var y = person[0];
// person[0] will return "John" »그것을 자신을 시도 경고!
명명 된 인덱스를 사용하는 경우, 자바 스크립트는 표준 객체 배열을 재정의합니다.
그 후, 모든 배열 메서드와 속성이 잘못된 결과를 생성합니다.
예:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length will
return 0
var y = person[0];
// person[0] will return undefined »그것을 자신을 시도 배열과 객체의 차이
자바 스크립트에서 배열은 번호가 인덱스를 사용합니다.
자바 스크립트에서 객체는 인덱스 이름을 사용합니다.
배열은 번호가 인덱스 오브젝트의 특별한 종류이다.
때 배열을 사용합니다. 때 개체를 사용합니다.
- 자바 스크립트는 연관 배열을 지원하지 않습니다.
- 당신이 문자열 (텍스트)로 요소 이름을 할 때 객체를 사용합니다.
- 당신이 번호로 요소 이름을 할 때 당신은 배열을 사용한다.
피 new Array()
자바 스크립트의 내장 배열 생성자를 사용할 필요가 없습니다 new Array() .
사용 [] 대신.
이 두 개의 서로 다른 문 모두 새로운 빈 배열이라는 점을 만듭니다
var points = new Array();
// Bad
var points = [];
// Good
이 두 개의 서로 다른 문 모두 6 숫자를 포함하는 새로운 배열을 만들 :
var points = new Array(40, 100, 1, 5, 25, 10) // Bad
var points = [40, 100, 1, 5, 25, 10];
// Good
»그것을 자신을 시도 new 키워드는 코드를 복잡하게한다. 또한 예기치 않은 결과가 발생할 수 있습니다 :
var points = new Array(40, 100); // Creates an array with two elements (40 and 100)I는 요소들 중의 하나는 무엇 제거하면?
var points = new Array(40); // Creates an array with 40 undefined elements !!!!! »그것을 자신을 시도 어떻게 배열을 인식하는 방법
일반적인 질문은 : 변수가 배열 인 경우 어떻게 알 수 있습니까?
문제는 자바 스크립트 연산자이다 typeof "개체"를 반환합니다 :
var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits; // returns object »그것을 자신을 시도 자바 스크립트 배열은 객체이기 때문에 typeof 연산자의 반환 객체.
해결책 1 :
이 문제를 해결하기 위해서, ECMAScript 5 새로운 방법을 정의 Array.isArray() :
Array.isArray(fruits); // returns true »그것을 자신을 시도 이 솔루션의 문제는이다 ECMAScript 5 이전 버전의 브라우저에서 지원되지 않습니다.
해결 방법 2 :
당신이 당신의 자신의 만들 수 있습니다이 문제를 해결하기 위해 isArray() 함수를 :
function isArray(x) {
return
x.constructor.toString().indexOf("Array") > -1;
} »그것을 자신을 시도 인수가 배열 인 경우 항상 위의 함수는 true를 반환합니다.
또는 더 정확하게 : 객체의 프로토 타입이 단어 "배열"을 포함하는 경우는 true를 돌려줍니다.
해결 방법 3 :
instanceof 개체가 주어진 생성자에 의해 생성되는 경우 연산자는 true를 반환합니다 :
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array // returns true »그것을 자신을 시도