본문 바로가기
FE/javascript

JavaScript 유사배열, DOM, instanceof(feat. 과제)

by 빠니몽 2021. 1. 29.

 

21.01.28(+21.02.01)

 

1. 유사배열

유사배열의 조건

1) length가 필요해야 한다.

2) 인덱스가 1씩 증가해야 한다.

 

유사배열의 예 : dom, arguments...

 

유사배열을 사용하는 이유

1) 함수의 반환값으로 배열을 돌려주고 싶을 떄

2) 배열에 있는 기능을 제공하고 싶지 않거나 없는 기능을 추가하고 싶을 때

 

유사배열은 진짜 배열과 달리 메소드를 쓸 수 없다.

Array.isArray() 메소드로 배열과 유사배열을 구분할 수 있다.

call함수, apply함수를 이용하면 일반 배열처럼 메소드를 이용할 수 있다.

또는 Array.from()을 이용해도 된다. (ES6 추가)

 

2. DOM이란

Document Object Model의 약어이다.

웹 브라우저가 HTML페이지를 인식하는 방식 또는 문서객체와 관련된 객체의 집합
문서객체란 HTML 태그들을 JS가 이용할 수 있는 객체로 만든 것
BOM의 한 종류이며 window의 하위객체이다
TREE구조로 구성되어있다.

 

BOM이란 Brouser Object Model의 약어이다.

  BOM은 브라우저와 관련된 객체들의 집합이며 최상위 객체는 window객체이다.

 

DOM 생성

document.createTestNode()로도 dom을 생성할 수 있다.

 

Dom트리 삽입

insertBefore(객체, 기준자식) 메소드로도 삽입 가능하다.

 

그외에 돔 id로 가져오기, 삭제하기, 내용 넣기는 각각

document.getElementById("아이디")

부모.removeChild(자식객체)

객체.innerHTML = ""; or 객체.innerText = "";

로 구현할 수 있다.

 

또한 떼어낸 DOM객체는 DOM트리의 임의의 위치에 다시 부착할 수 있다.

 

3. instanceof

비교연산자이다.

instanceof는 해당하는 변수가 사용하고 있는 prototype의 chain을 2번째 인자와 쭉 비교해서 true/false 값을 리턴한다.

주의 : 꼭 변수(객체)를 왼쪽 인자로 사용해야 한다. 오른쪽은 비교할 고정값이다.