Javascript (4)

lakewood·2021년 1월 14일
0

javascript

목록 보기
4/6

객체의 속성과 메서드

객체에서 값을 담고 있는 정보를 속성(property)라고 부릅니다.
속성은 자바스크립트 내장 객체에도 만들어져 있습니다.
객체의 속성 값을 가져올 때는 객체 이름 뒤에 마침표(.)를 찍고
그 뒤에 속성 이름을 적습니다.

자바스크립트에는 열려 있는 웹 브라우저 창의 정보를 담은 Navigator 객체가 있습니다. 브라우저의 개발자 콘솔 창에 navigator.을 입력하면 사용할 수 있는 속성과 함수들이 뜹니다. 이어서 navigator.vendor를 모두 입력하면 vendor 속성에 저장된 브라우저 제조업체의 정보가 뜹니다.

navigator.vendor
"Google Inc."

Navigator 객체에는 브라우저가 인터넷에 연결되어 있는지 여부를 저장하고 있는 onLine 속성이 존재합니다. 인터넷에 연결되어 있다면 true, 아니면 false를 반환합니다.

navigator.onLine
true

객체에서 속성 말고도 중요한 개념이 있는데 바로 메서드입니다.
메서드는 객체가 어떻게 동작할지를 선언해 놓은 함수입니다.
예를 들어 Window 객체 안에는 웹 브라우저 창과 관련된 메서드가 미리 만들어져 있습니다. 콘솔창에 window라고 입력하고 Enter를 누르면 Window라고 표시됩니다. 첫 글자가 대문자로 시작하는 것은 객체를 의미합니다.

Window 객체의 함수는 이름만 사용해서 실행할 수 있습니다.
Window 객체가 모든 객체를 품고 있는 최상위 객체이기 때문입니다.

alert("window객체의 alert 함수를 사용합니다.")

객체의 프로토타입과 인스턴스

웹 문서에 있는 요소를 프로그램에서 사용하려면 객체 형태여야 합니다. 예를 들어 웹 문서에 있는 이미지를 자바스크립트에서 다루려면 Image 객체를 사용합니다. Image 객체는 모든 웹 이미지가 공통으로 가지는 속성과 기능을 모아 놓은 것 입니다. 이러한 웹 이미지를 만들기 위한 기본 틀을 프로토타입이라고 합니다. 만약 웹 문서에 3개의 이미지를 포함시켜야 한다면 Image 객체를 사용해서 똑같은 모양의 객체 3개를 찍어낸 다음 객체마다 원하는 이미지를 담으면 됩니다. 이렇게 프로토타입을 사용해 만들어낸 객체는 인스턴스라고 합니다. 세 인스턴스는 모두 Image 객체의 속성과 함수를 그대로 사용할 수 있습니다. (인스턴스를 개별 객체라고 부르기도 합니다.)

객체의 인스턴스 만들기

객체의 인스턴스를 만들 때, 객체를 똑같이 찍어 새 객체를 만들 때는 new 예약어를 사용합니다. new 예약어 뒤에 프로토타입 객체 이름과 괄호 ()를 써 주면 됩니다.

var now = new Date()
now
Thu Jan 14 2021 19:40:20 GMT+0900 (한국 표준시)

profile
versatility (ode

0개의 댓글