>웹 프론트엔드 >JS 튜토리얼 >컬렉션은 배열이 아닙니다

컬렉션은 배열이 아닙니다

Lisa Kudrow
Lisa Kudrow원래의
2025-03-06 00:44:10468검색

A collection is not an array

컬렉션은 배열이 아닙니다

나는 때때로 Dom 요소 모음 (더 공식적으로 Nodelist라고 함)이 배열처럼 조작 할 수 없다는 사실에 의해 가끔 짜증이납니다. 그러나 그것은 하나처럼 보이며, 그것이 다가오는 JavaScript 참조의 경우 컬렉션의 모든

dom 객체에 대해이 지점을 주목해야한다고 생각하는 JavaScript 초보자가 자주 저지른 실수라고 생각합니다. 배열과 같은 컬렉션을 반복 할 수 있습니다.

그러나 push (), splice () 또는 Reverse ()와 같은 배열 메소드를 사용하여 조작 할 수 없습니다.

for(var i=0; i<collection.length; i++)
{
	//whatever
}
다음 단계를 수행하여 배열로 변환 할 수있는 경우를 제외하고. 이것은 실제로 사소한 일입니다.

위의 코드는 완전히 교차 브라우저이며 원래 컬렉션으로 인수로 호출됩니다.

function collectionToArray(collection)
{
	var ary = [];
	for(var i=0, len = collection.length; i < len; i++)
	{
		ary.push(collection[i]);
	}
	return ary;
}

그러나 기본 객체 프로토 타이핑 (Opera, Firefox 및 Safari 3)을 지원하는 브라우저 만 처리하면됩니다.

var elements = collectionToArray(document.getElementsByTagName('*'));

그런 다음 개별 컬렉션의 방법으로 호출 할 수 있습니다.

NodeList.prototype.toArray = function()
{
	var ary = [];
	for(var i=0, len = this.length; i < len; i++)
	{
		ary.push(this[i]);
	}
	return ary;
};

이 변환에는 한 가지 명백한 단점이 있습니다 (그러나 완료). 결과 배열은 더 이상 노드리스트가되지 않을 것입니다. 분명하지만 그렇습니다. 그러나 두 가지 의미가 있기 때문에 관련이 있습니다.

    그것은 노드리스트로부터 상속 된 특성과 방법을 잃게됩니다. 그러나 NODELIST에는 하나의 속성 (길이가 배열에서도 사용할 수있는 길이)과 하나의 방법 (item () 메소드 (item () 메소드는 구성원이 여전히 중복됩니다. 멤버는 여전히 Square-Bracket 표기법으로 참조 할 수 있기 때문입니다). 따라서이 손실은 전혀 중요하지 않습니다 더 이상 라이브 컬렉션이 아닙니다. 노드리스트는 객체 모음에 대한
  • 참조
  • 이며, 해당 컬렉션이 변경되면 (예 : 요소가 추가되거나 제거되는 경우) Nodelist는 자동으로 해당 변경을 반영하기 위해 업데이트됩니다. 반대로 우리의 배열은 한 시점에 컬렉션의 정적 스냅 샷이므로 DOM 의 변경에 대한 응답으로 업데이트되지 않습니다. 응용 프로그램에 따라 중요 할 수 있습니다. JavaScript 컬렉션 및 배열에 대한 질문 javaScript의 컬렉션과 배열의 차이점은 무엇입니까? JavaScript에서 컬렉션은 요소 그룹이 포함 된 개체입니다. 이러한 요소는 다른 컬렉션을 포함하여 모든 유형 일 수 있습니다. 컬렉션은 종종 유사한 항목 그룹으로 작업해야 할 때 사용되지만 배열과 동일한 방법과 속성이 없습니다. 반면, 배열은 항목 목록을 나타내는 특수 유형의 객체입니다. 배열에는 푸시, 팝, 시프트, 시프트 등과 같은 내용을 조작하고 쿼리하기위한 내장 방법이 있습니다.

컬렉션을 JavaScript의 배열로 변환하는 방법

컬렉션을 javaScript의 배열로 변환하는 몇 가지 방법이 있습니다. 가장 일반적인 방법 중 하나는 배열 () 함수를 사용하는 것입니다. 이 함수는 반복 가능한 객체에서 새 배열 인스턴스를 만듭니다. 예는 다음과 같습니다.

let collection = document.getElementsByTagName ( 'div');

varray = array.from (collection);

let array = array.from (collection);

div 요소의 컬렉션은 배열로 변환됩니다.




no는 할 수 없기 때문에 배열을 사용할 수 없습니까? 배열. 그러나 배열 () 또는 스프레드 연산자를 사용하여 컬렉션을 배열로 변환 한 다음 결과 배열에서 배열 메소드를 사용할 수 있습니다.

javaScript에서 배열을 통해 컬렉션을 사용하는 장점은 무엇입니까?

JavaScript의 컬렉션은 종종 돔 요소를 다룰 때 사용됩니다. DOM에 대한 라이브 링크를 제공합니다. 즉, DOM이 변경되면 컬렉션이 자동으로 업데이트됩니다. 이것은 배열이 할 수없는 것입니다. 그러나 배열에는 데이터 조작을위한 더 많은 내장 방법이 있으므로 데이터 조작 작업에 더 편리합니다. javaScript의 배열과 같은 객체 란 무엇입니까?

배열과 같은 객체는 길이가 속성을 가지며 어레이와 마찬가지로 특정 지수에 요소를 저장할 수있는 객체입니다. 그러나 푸시, 팝 등과 같은 배열 메소드가 없습니다. 배열과 같은 객체의 일반적인 예는 모든 함수 내에서 사용 가능한 인수 객체입니다.

객체가 javaScript의 배열 또는 컬렉션인지를 식별 할 수 있습니까?

array.isarray () 메소드를 사용하여 객체가 배열인지 확인할 수 있습니다. 이 메소드는 객체가 배열 인 경우 true를 반환하고 그렇지 않으면 False가됩니다. 객체가 컬렉션인지 확인하는 내장 방법은 없지만 길이 또는 항목과 같이 컬렉션에 공통적 인 특정 속성이 있는지 확인할 수 있습니다.

스프레드 연산자를 사용하여 컬렉션을 배열로 변환 할 수 있습니까? 스프레드 연산자는 컬렉션의 요소를 새로운 배열로 퍼뜨려 작동합니다. 예는 다음과 같습니다.

let collection = document.getEtementsByTagName ( 'div');

array = [... collection];

javascript의 정적 컬렉션과 라이브 컬렉션의 차이점은 무엇입니까?

JavaScript의 라이브 컬렉션은 DOM이 변경 될 때 자동으로 업데이트되는 컬렉션입니다. 즉, 요소가 DOM에서 추가되거나 제거되면 이러한 변경 사항을 반영하도록 컬렉션이 자동으로 업데이트됩니다. 반면에 정적 컬렉션은 DOM이 변경 될 때 업데이트되지 않습니다. 일단 생성되면 DOM의 변경 사항에 관계없이 동일하게 유지됩니다.
JavaScript의 컬렉션에서 요소를 추가하거나 제거 할 수 있습니까?
아니요. 컬렉션에서 요소를 직접 추가하거나 제거 할 수 없습니다. 컬렉션은 읽기 전용입니다. 그러나 컬렉션이 기반으로 한 DOM 요소를 수정할 수 있습니다. 이는 라이브 컬렉션 인 경우 컬렉션을 업데이트 할 수 있습니다.
javaScript의 컬렉션에서 Foreach를 사용할 수 있습니까?

아니요, 컬렉션이 배열이 아니기 때문에 컬렉션에서 직접 Foreach를 사용할 수 없습니다. 그러나 배열 () 또는 스프레드 연산자를 사용하여 컬렉션을 배열로 변환 한 다음 결과 배열에서 Foreach를 사용할 수 있습니다.

위 내용은 컬렉션은 배열이 아닙니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.