Javascript 배열 및 사전 사용 및 객체 속성 탐색 기술_javascript 기술

Javascript의 배열 Array는 배열이자 사전입니다. 배열을 사용하는 방법을 알아보기 위해 예제를 살펴보겠습니다.

코드 복사 코드는 다음과 같습니다.

var a = new Array()
a [0] = "Acer";
a[1] = "Dell"
for (var i = 0; i < a.length; i ) {
alert(a[ i]) ;
}

사전 사용법을 살펴보겠습니다.

코드 복사 코드는 다음과 같습니다.

var Computer_price = new Array()
computer_price ["Acer"] = 500;
computer_price["Dell"] = 600;
alert(computer_price["Acer"])

위의 배열(사전)

코드 복사 코드는 다음과 같습니다.

for (var i incomputer_price) {
alert(i ": "computer_price[i]);
}

여기의 i는 사전의 각 키 값입니다. 출력 결과는 다음과 같습니다.
Acer: 500
Dell: 600

또한,computer_price는 사전 개체이고 각 키 값은 속성입니다. 즉, Acer는 Computer_price의 속성입니다. 다음과 같이 사용할 수 있습니다.
computer_price.Acer

사전과 배열의 단순화된 선언을 살펴보겠습니다.
var array = [1, 2, 3]; // 배열
var array2 = { "Acer": 500, "Dell": 600 } // 사전
alert(array2.Acer); // 500
이 사전 선언은 이전 선언과 동일합니다. 이 예에서 Acer는 키 값이며 사전 개체의 속성으로 사용될 수도 있습니다.

객체의 속성을 순회하는 방법을 살펴보겠습니다. for in을 사용하여 객체의 속성을 반복할 수 있습니다.

코드 복사 코드는 다음과 같습니다.

기능 컴퓨터(브랜드, 가격) {
this .brand = 브랜드;
this.price = 가격;
}
var mycomputer = new Computer("Acer", 500)
for (var prop in mycomputer) >alert( "computer[" prop "]=" mycomputer[prop]);
}

위 코드에서 Computer에는 브랜드와 가격이라는 두 가지 속성이 있습니다. :
computer[brand]=Acer
computer[price]=500
위 사용법을 사용하여 개체가 어떤 속성을 가지고 있는지 확인할 수 있습니다. Computer 개체에 브랜드 속성이 있다는 것을 이미 알고 있는 경우
mycomputer.brand
또는 mycomputer[brand]
를 사용하여 속성 값을 가져올 수 있습니다.
요약: Javascript의 배열을 사용하여 사전을 만들 수도 있습니다. 사전의 키 값은 사전 개체의 속성이기도 합니다. 객체의 속성을 탐색할 때 for in을 사용할 수 있습니다.

배열 순회 및 속성
배열은 JavaScript의 객체이지만 for in 루프를 사용하여 배열을 순회할 이유가 없습니다.
반대로 배열을 반복하는 데 for를 사용하지 않는 데는 몇 가지 이유가 있습니다.
참고: JavaScript의 배열은 연관 배열이 아닙니다.
JavaScript에는 키-값 대응을 관리하는 개체만 있습니다. 그러나 연관 배열은 순서를 유지하지만 객체는 그렇지 않습니다.
for in 루프는 프로토타입 체인의 모든 속성을 열거하므로 이러한 속성을 필터링하는 유일한 방법은 hasOwnProperty 함수를 사용하는 것입니다.
따라서 일반 for 루프보다 몇 배나 느립니다.
순회
배열 순회 성능을 최대화하려면 클래식 for 루프를 사용하는 것이 좋습니다.

코드 복사 코드는 다음과 같습니다.

var list = [1, 2, 3 , 4, 5, ... 100000000];
for(var i = 0, l = list.length; i < l; i ) {
console.log(list[i]); >}


위 코드에는 l = list.length를 통해 배열의 길이를 캐시하는 처리가 있습니다.

길이는 배열의 속성이지만 각 루프에서 길이에 액세스할 때 성능 오버헤드가 있습니다.
최신 JavaScript 엔진이 이와 관련하여 최적화되었을 수도 있지만, 우리 코드가 이러한 최신 엔진에서 실행되는지 여부는 보장할 수 없습니다.
사실 배열 길이를 캐싱하지 않는 방식은 캐싱된 버전보다 훨씬 느립니다.
length 속성
length 속성의 getter 메소드는 단순히 배열의 길이를 반환하는 반면, setter 메소드는 배열을 자릅니다.

코드 복사 코드는 다음과 같습니다.

var foo = [1, 2, 3, 4, 5, 6]
foo.length = 3
foo; .length = 6;
foo; // [1, 2, 3]

번역자 주:
현재 Firebug에서 foo의 값을 확인하세요: [1, 2 , 3, 정의되지 않음, 정의되지 않음, 정의되지 않음]
하지만 이 결과는 정확하지 않습니다. Chrome 콘솔에서 foo의 결과를 보면 다음과 같습니다. [1, 2, 3]
왜냐하면 JavaScript에서 undefound는 변수입니다. 변수는 키워드가 아니므로 위 두 결과의 의미는 완전히 다릅니다.
// 번역자 주: 확인을 위해 다음 코드를 실행하여 foo에 일련번호 5가 존재하는지 확인해 보겠습니다.
5 in foo; // Firebug 또는 Chrome에서 false를 반환합니다.
foo[5] = 정의되지 않음;
5 in foo; // Firebug 또는 Chrome에서 true를 반환합니다.
은 길이 A로 설정됩니다. 값이 작을수록 배열이 잘리지만 길이 속성을 늘려도 배열에는 영향을 주지 않습니다.
결론
더 나은 성능을 위해서는 일반 for 루프를 사용하고 배열의 길이 속성을 캐시하는 것이 좋습니다.
in을 사용하여 배열을 반복하는 것은 잘못된 코딩 관행으로 간주되며 오류를 생성하고 성능 문제를 일으키는 경향이 있습니다.