자바스크립트에서 객체는 매우 중요한 개념이다. 다양한 내장 타입을 포함한 모든 값들은 사실상 객체이다. 함수? 그것도 객체다. 배열? 마찬가지로 객체다. 자바스크립트에서 객체는 키(key)와 값(value)으로 구성된 프로퍼티들의 집합이다. 객체는 여러 데이터와 함수를 하나로 묶어 놓은 복합적인 자료구조로서, 자바스크립트의 핵심 요소 중 하나이다.
자바스크립트에서 객체를 만드는 가장 기본적인 방법은 중괄호 {}
를 사용한다. 이를 객체 리터럴이라고 한다.
let student = {
name: '홍길동',
age: 20
};
위와 같이 간단히 객체를 만들 수 있다. 여기에 함수도 추가할 수 있다.
let student = {
name: '홍길동',
age: 20,
greeting: function() {
console.log(`안녕하세요, ${this.name}입니다.`);
}
};
객체의 프로퍼티를 열거하기 위해서는 for...in
문을 사용할 수 있다. for...in
문은 객체의 모든 열거 가능한 프로퍼티를 반복하며 프로퍼티 키를 반환한다.
for (let key in student) {
console.log(key + ': ' + student[key]);
}
자바스크립트에서는 객체의 프로퍼티를 쉽게 추가, 수정, 삭제할 수 있다.
student.height = 180; // 프로퍼티 추가
student.age = 21; // 프로퍼티 수정
delete student.height; // 프로퍼티 삭제
객체의 프로퍼티에 접근하기 위해서는 점 .
또는 대괄호 []
를 사용할 수 있다. 점을 사용하는 것이 일반적이지만, 프로퍼티 키가 변수에 저장된 경우나 유효한 식별자 형식이 아닌 경우 대괄호를 사용한다.
console.log(student.name); // 점 표기법
let key = 'name';
console.log(student[key]); // 대괄호 표기법
생성자는 객체를 만들어내는 함수이다. 생성자 함수 이름의 첫 글자는 대문자로 시작하는 것이 관례이다. 생성자 함수를 호출할 때는 new
연산자를 사용한다.
function Student(name, age) {
this.name = name;
this.age = age;
this.greeting = function() {
console.log(`안녕하세요, ${this.name}입니다.`);
};
}
let student1 = new Student('홍길동', 20);
let student2 = new Student('이몽룡', 22);
객체는 이런 식으로 생성자를 이용해서 만들 수 있으며, 이런 객체를 생성자의 인스턴스라고 한다. 이렇게 만든 인스턴스는 생성자의 프로토타입을 상속받는다.
자바스크립트에서 가장 특이한 개념 중 하나는 바로 프로토타입이다. 이 프로토타입은 어떤 객체가 다른 객체로부터 속성들을 상속받을 수 있게 하는 메커니즘이다.
function Student(name, age) {
this.name = name;
this.age = age;
}
Student.prototype.greeting = function() {
console.log(`안녕하세요, ${this.name}입니다.`);
}
let student1 = new Student('홍길동', 20);
let student2 = new Student('이몽룡', 22);
student1.greeting(); // "안녕하세요, 홍길동입니다."
student2.greeting(); // "안녕하세요, 이몽룡입니다."
여기서 greeting 메소드는 Student의 모든 인스턴스에서 사용할 수 있다. 이는 프로토타입이 인스턴스에 메소드를 제공하므로 가능하다.
프로토타입 체인이란, 객체의 프로토타입이 다시 다른 객체의 프로토타입을 참조할 수 있는 이어진 체인을 말한다. 이 체인은 마지막에 null로 끝나며, 이 null은 프로토타입 체인의 종점이다.
프로토타입 체인은 속성이나 메소드를 찾을 때 사용된다. 객체에 특정 속성이나 메소드가 없으면, 자바스크립트는 프로토타입 체인을 따라가며 해당 속성이나 메소드를 찾는다.
console.log(student1.toString()); // "[object Object]"
여기서 toString 메소드는 student1 객체에는 없지만, 프로토타입 체인을 통해 Object.prototype에서 찾을 수 있다.
객체를 생성하고, 객체의 프로퍼티와 메소드를 다루며, 프로토타입과 프로토타입 체인에 대해 배웠다. 객체는 자바스크립트에서 중요한 개념이며, 자바스크립트를 통해 더 복잡한 프로그램을 작성하려면 이러한 개념을 잘 이해해야 한다. 따라서, 단순히 객체를 사용하는 것이 아니라 자바스크립트의 객체 지향 프로그래밍에 대한 이해를 넓히는 것이 중요하다.
추후에 프로토타입에 대해 좀더 상세하게 다룰것이다.