3주차 (8~9장)

내장 객체 (built-in object) :

• 사용자가 손쉽게 가져와서 사용할 수 있도록 미리 만들어진 객체
• 자바스크립트 언어 자체에 내장되어 있는 객체로, 특정 기능을 제공하기 위해 사용
• Number, Boolean, String, Math, Date, Array, Object 등이 있음.

window객체

• 웹 브라우저의 내장 객체 중 웹 브라우저 창과 관련된 객체임.
• 모든 객체의 최상위 객체
• 웹 브라우저의 창을 나타내는 전역 객체. 이 객체에는 브라우저 창의 크기, 스크롤 위치, URL, 문서 객체 등의 속성과 메서드가 포함되어 있음.
• 웹 브라우저에서만 사용 가능하며, 웹 페이지에서 자바스크립트를 사용할 때 기본적으로 제공되는 객체

(최상위객체 : 모든 객체를 포함하고 있는 가장 기본이 되는 객체. 가지고 있는 프로퍼티와 메서드가 매우 많음.)

 

screen 객체

• 사용자의 스크린(모니터)에 대한 정보를 제공하는 객체
• 사용자 스크린의 너비, 높이, 색상 깊이 등과 같은 속성과 메서드가 포함되어 있다.
• screen.width, screen.height 등이 있다.

Date 객체

• 날짜와 시간 정보를 다루기 위한 객체
• 현재 날짜와 시간을 가져오는 기능뿐 아니라, 날짜와 시간을 조작하거나 계산하는 메서드를 제공한다. 예) 디데이 기능
• getDate(), getDay(), getHours(), getMinutes(), setDate(), setHours(), setMinutes(), setSeconds() 등이 있다.

Math객체

• 수학적인 상수와 함수를 다루기 위한 내장 객체
• Date나 Array객체처럼 new라는 예약어로 객체의 인스턴스를 만들지 않는다.
• Math.PI, Math.abs(), Math.ceil(), Math.floor(), Math.max(), Math.min(), Math.round(), Math.sqrt(), Math.pow(), Math.random() 등이 있다.

 

객체는 여러 프로퍼티로 구성됨.

프로퍼티는 ‘키 : 값’ 형태를 가짐

프로퍼티의 값이 함수일 경우 ‘메서드’라고 함.

메서드 없이 자료만 있는 객체를 ‘데이터 객체’라고도 함.

 

this

• 함수가 호출될 때 자신을 호출한 객체를 가리키는 키워드
• this 키워드를 사용하여 객체 내부에서 메서드를 호출할 때, 해당 메서드가 속한 객체(내부의 속성이나 메서드를)를 참조할 수 있다.
• 예 ) book이라는 객체 안에 title, pages, author, done, finish라는 프로퍼티가 있다. 이중 finish()는 책을 다 읽었는지의 여부를 표시하는 메서드이다. finish 메서드 안에서 book의 프로퍼티를 사용한다면, done 값을 조회할 때 book이라는 객체이름 대신 this라는 예약어를 사용할 수 있다.

 

 

 

생성자 함수와 클래스

: 똑같은 프로퍼티와 메서드를 지닌 객체를 반복해서 만든다면 메모리 공간이 낭비될 것이다. 이 경우 미리 객체마다 반복되는 프로퍼티와 메서드를 미리 정의해놓고 그 틀을 사용하여 객체를 만든다.

생성자 함수

• function 키워드를 사용하여 정의되며, 객체를 생성하기 위해 new 키워드를 사용한다.→ 인스턴스 또는 인스턴스 객체 생성. 생성자 함수는 함수 내부에 this키워드를 사용하여 새로 생성된 객체의 속성을 설정할 수 있다.

클래스

• class 키워드를 사용하여 정의되며, 객체를 생성하기 위해 new 키워드를 사용한다. 클래스 내부에서 constructor 메서드를 사용하여 객체의 속성을 설정할 수 있습니다.
• 생성자 함수와 달리 상속을 지원한다. extends 키워드를 사용하여 클래스를 상속하고, super 키워드를 사용하여 부모 클래스의 생성자를 호출할 수 있다.

상속

• 부모 객체의 프로퍼티나 메서드를 가져와서 사용할 수 있는 것을 의미.
• JavaScript에서는 프로토타입 체인(prototype chain) 매커니즘을 통해 상속을 구현한다.

프로토타입

• 객체를 만들어 내는 원형. 상위 객체. 부모 객체 라고도 할 수 있다.
• 모든 객체는 프로토타입을 가지고 있고, 프로토타입으로부터 프로퍼티와 메서드를 상속 받는다.

 

 

Q. 다음코드의 실행 결과는?

//생성자 함수 정의
function Person(name, age) {
  this.name = name;
  this.age = age;
}

//프로토타입 메서드 정의
Person.prototype.introduce = function() {
  console.log(`Hi, my name is ${this.name} and I'm ${this.age} years old.`);
};

//객체 생성
const person1 = new Person("Alice", 25);

//프로토타입 메서드 호출
person1.introduce(); //다음 코드의 실행 결과는?

Hi, my name is Alice and I'm 25 years old.