본문 바로가기

자바스크립트/자바스크립트 개념

[JavaScript] 객체의 속성과 메소드, 프로토타입 객체 / 2021.11.09

1. 객체 자료형

속성과 메소드를 가질 수 있는 모든 것은 객체이다. 따라서 배열도 객체이다. 

예시를 통해 알아보자.

아래 예시는 a라는 이름의 배열을 선언한 후 배열에 속성을 지정하는 예제이다. 

 

배열

 

또한 함수도 객체이다. 

아래 예시는 함수 b를 선언하고 함수에 속성을 지정하는 예제이다.

 

함수

 

함수는 '실행이 가능한 객체'라는 특이한 자료이다. 함수는 객체의 특성을 완벽하게 가지고 있으므로 자바스크립트에서는 함수를 일급 객체에 속한다고 표현하기도 한다.

 

2. 기본 자료형

자바스크립트에서는 실체가 있는 것(undefined와 null 등이 아닌 것) 중에 객체가 아닌 것을 기본자료형이라고 부른다.

숫자, 문자열, 불이 바로 기본 자료형이다. 이러한 자료형은 객체가 아니므로 속성을 가질 수 없다. 

 

다음은 기본 자료형이 속성을 가질 수 없다는 예시이다.

 

기본 자료형은 속성을 가질 수 없음

 

2-1. 기본 자료형을 객체로 선언하기

기본 자료형을 객체로 선언하는 방법이 있다. 바로 Number, String, Boolean 함수를 사용하는 것이다.

 

const 객체 = new 객체 자료형 이름()

 

숫자 자료형을 예시로 알아보자.

 

객체로 선언하기

 

new Number()를 사용해서 기본 자료형을 객체로 선언한다면 숫자와 관련된 연산자도 모두 활용할 수 있으며, 속성과 메소드도 활용할 수 있다.

 

3. 프로토타입으로 메소드 추가하기

prototype객체에 속성과 메소드를 추가하면 모든 객체(와 기본 자료형)에서 해당 속성과 메소드를 사용할 수 있다.

 

객체 자료형 이름.prototype.메소드 이름 = function() {
}

 

예시를 통해 알아보자. 다음과 같이 프로토타입 객체에 속성을 추가한다면 기본 자료형 뒤에 온점을 찍고 속성을 활용할 수 있다.

 

프로토타입 객체

 

조금 더 실용적인 예시를 살펴보자.

자바스크립트에서 문자열 내부에 어떤 문자열이 있는지, 배열 내부에 어떤 자료가 있는지 확인할 때 indexOf()메소드를 사용한다. 문자열의 indexOf() 메소드를 사용하는 예를 살펴보자.

 

indexOf() 메소드 활용 예

 

문자열 내부에 있는 문자열이라면 해당 문자열이 시작하는 위치(인덱스)를 출력하고 없다면 -1을 출력한다.

위의 예시를 indexOf()메소드를 활용한 contain() 메소드로 바꾸어 해당 문자열이 내부에 있다면 true 아니면 false를 출력할 수 도 있다.

 

contain() 메소드