로직을 읽고 해석하는데 어려움을 느껴 객체에 대한 이해가 많이 부족하다는 결론을 내리고 주어진 자료를 더 직관적으로 알아보기 쉽게 요약 정리해보았다.
- 객체와 속성
객체(Object)는 상태(속성, property)과 행동(메소드, method)를 가지는 컨테이너이다. 객체를 만들 때는 중괄호({})를 사용하여 객체를 만들고, 각 속성을 쉼표(,)로 구분하여 추가한다. 속성은 이름(name)과 값(value)을 가지며, 이름은 문자열(string)로 작성하고, 값은 다양한 데이터 타입을 사용할 수 있다.
let person = {name: 'Alice', age: 20};
person.name //'Alice'
person.age //'20'
//객체의 이름은 person이며, 중괄호 안에 있는 내용은 객체의 속성이다.
//name, age는 속성의 name이며, 'Alice'와 20은 속성의 value이다.- 객체의 메소드
객체 내부의 함수(function)를 메소드(method)라고 부르며, 속성의 값으로 함수를 추가할 수 있다. 객체를 만들어서 필요한 속성과 메소드를 추가하여 사용한다. 따라서 형식은 "Object.property.method()"가 된다.
let person = {name: 'Alice', age: 20};
let upperCaseName = person.name.toUpperCase();
console.log(upperCaseName); // "ALICE"
let nameArray = person.name.split('');
console.log(nameArray); // ["A", "l", "i", "c", "e"]함수와 메소드의 차이점은 "독립성"에 있다. 함수는 그 자체로 독립적인 기능을 수행하지만 메소드는 자신을 호출한 대상 객체에 대한 동작을 수행한다.
- 생성자 함수를 사용한 객체 생성
생성자 함수(constructor function)는 일관적인 패턴으로 객체를 생성할 수 있게 해주는 함수이다. new 키워드를 사용하여 새로운 객체를 만들 수 있다. 생성자 함수를 사용하여 객체를 만들면 해당 객체는 함수의 프로토타입에 정의된 속성과 메서드를 상속한다.
function Person(name, age, gender) {
this.name = name;
this.age = age;
this.gender =gender;
}
let person1 = new Person("홍길동", 30, "남자");
let person2 = new Person("홍길순", 25, "여자"); 이때 함수 Person 안에 사용된 'this'는 새로 생성되는 객체(person1, person2) 자체를 가리키며, 새로운 객체의 속성에 값을 할당할 때 사용된다. 함수 안에 있는 this는 호출 주체를 알 수 없을 경우(함수가 독립적으로 호출되었을 경우) 전역 객체를 가리킨다.
또한 생성자 함수를 호출하는 객체를 인스턴스(instance)라고 한다.
- 클래스(Class)
클래스는 위의 생성자 함수와 같이 객체를 생성하는 방법 중의 하나이다. 클래스는 자바스크립트 기반이 아닌 다른 언어에서 사용되던 기법이나, 자바스크립트로 넘어온 개발자들이 클래스 처럼 개발하려는 시도로 인해 ES6에서 클래스를 도입하게 되었다고 한다. 기본 구조는 다음과 같다.
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name} and I'm ${this.age} years old.`);
}
}
const person1 = new Person("Alice", 30);
const person2 = new Person("Bob", 25);
person1.sayHello(); // "Hello, my name is Alice and I'm 30 years old."
person2.sayHello(); // "Hello, my name is Bob and I'm 25 years old."constructor는 class의 생성자 함수이다. 생성자 함수는 객체를 생성할 때 호출되며, 객체를 초기화하는 역할을 한다. 위에서 constructor 메소드는 name과 age를 인자로 받아 this.name과 this.age 속성을 초기화한다.
