JavaScript

JavaScript 객체

수연 (Suyeon) 2022. 2. 2. 00:07
반응형

출처 : Do it! 자바스크립트 입문편

 

객체 종류

1. 내장 객체

- 자바스크립트에서 자주 사용하는 객체가 미리 만들어져 있는 것을 의미합니다.

 

2. DOM(문서 객체 모델)

- 객체를 사용해서 웹 문서를 관리하는 것을 의미합니다.

- 이미지를 담는 Image 객체, 웹 문서를 담는 Document 객체가 있습니다.

 

3. 브라우저 객체 모델

- 웹 브라우저의 주소 표시줄, 창 크기를 관리합니다.

- 사용자의 브라우저 종류나 버전을 담고 있는 Navigator, 브라우저에서 방문한 기록을 담는 History,

  주소 표시줄 정보를 담고 있는 Location이 있습니다.

 

4. 사용자 정의 객체

- 자신이 필요할 때 사용할 수 있도록 직접 정의해서 만드는 객체입니다. (object 같이)

- let book = { 속성이름 : 값, 함수이름 : function() {} }

 


 

객체의 속성과 메서드

1. 속성

- 객체에서 값을 담고 있는 것을 속성이라고 합니다.

- 객체의 값을 가져올 때 .(마침표)를 붙이고 그 뒤에 속성 이름을 씁니다.

ex #1.)

- Navigator 속성 알아보기 ➡ 콘솔 창에 'Navigator.'을 치면 사용할 수 있는 속성을 보여줍니다.

- 'Navigator.vendor'을 입력하면 '브라우저 제조 업체'가 나옵니다.

ex #2.)

- Navigator 속성에는 인터넷의 연결 여부를 확인할 수 있는 onLine이 있습니다.

- 연결되면 true, 연결이 안되면 false 결과가 출력됩니다.

 

2. 메서드

- 객체가 어떻게 동작할지를 미리 정의해놓는 함수입니다.

ex) window 를 콘솔창에 검색하기

- window에서 미리 정의된 메서드가 무엇인지 다 확인할 수 있습니다. (alert, open 등)

- window 객체는 모든 객체를 품고 있는 최상위 객체이기 때문에 window.alert()가 아닌 alert()로 사용할 수 있습니다.

 

3. 프로토타입

- Image 객체는 모든 웹 이미지가 공통으로 가지는 속성과 기능을 모아 놓은 것입니다.

- 이것을 프로토타입이라고 합니다. (날짜에 관련된 모든 기능을 모아놓은 것을 Date 프로토타입이있다.)

 

4. 객체 인스턴스 만들기

- new 프로토타입() 으로 만들었습니다.

ex) let now = new Date()

 

5. 정리된 모든 함수 확인하기

- developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects 에서 확인하기

- Math.floor(Math.random()*30 +1) ➡ 1~30까지의 수를 무작위로 냅니다.

728x90