자바스크립트(JavaScript)의 객체 지향 프로그래밍 지원

JavaScript는 웹 개발, 서버 측 스크립팅, 심지어 데스크톱 및 모바일 애플리케이션 개발에 사용되는 다재다능한 프로그래밍 언어입니다. 동적 및 대화식 웹 페이지를 만드는 유연성과 기능으로 유명합니다.

JavaScript는 또한 Java 및 Python과 같은 다른 많은 언어에서 사용되는 널리 사용되는 프로그래밍 패러다임인 객체 지향 프로그래밍을 지원합니다. JavaScript가 객체 지향 프로그래밍을 지원하는 방법과 코드에서 구현하는 방법을 살펴봅니다.

 

자바스크립트 객체란

OOP(객체 지향 프로그래밍)는 객체 개념을 기반으로 하는 프로그래밍 패러다임입니다.

 

객체는 실제 엔터티를 나타내는 관련 데이터 및 기능의 모음입니다. OOP는 코드를 재사용 가능한 모듈로 구성하는 방법을 제공하므로 시간이 지남에 따라 코드를 보다 쉽게 ​​유지 관리하고 업데이트할 수 있습니다.

 

JavaScript는 객체와 프로토타입을 사용하여 OOP를 지원합니다.

JavaScript의 객체는 순서가 지정되지 않은 키-값 쌍의 모음입니다. 여기서 키는 문자열이고 값은 다른 객체를 포함하여 모든 유형이 될 수 있습니다. 객체 리터럴, 생성자 함수 또는 new 키워드를 사용하여 JavaScript에서 객체를 만들 수 있습니다.

 

예를 들어 객체 리터럴을 사용하여 객체를 생성해 보겠습니다.

let person = {

name: "John",

age: 30,

sayHello: function() {

console.log("Hello, my name is " + this.name);

}

};



person.sayHello(); // Output: "Hello, my name is John"

 

이 예제에서는 name, age 및 sayHello의 세 가지 속성이 있는 person이라는 객체를 만들었습니다. sayHello 속성은 메시지를 콘솔에 기록하는 기능입니다.

728x90

JavaScript에서 객체를 생성하는 또 다른 방법은 생성자 함수를 사용하는 것입니다.

 

생성자 함수는 객체를 생성하는 데 사용되는 특수한 유형의 함수입니다. 생성자 함수를 만들려면 function 키워드 뒤에 함수 이름과 괄호 세트를 사용합니다. 괄호 안에 객체 속성을 초기화하는 데 사용할 매개 변수를 정의할 수 있습니다.

 

 

예를 들어 생성자 함수를 사용하여 객체를 생성해 보겠습니다.

function Person(name, age) {

this.name = name;

this.age = age;

this.sayHello = function() {

console.log("Hello, my name is " + this.name);

};

}



let person = new Person("John", 30);

person.sayHello(); // Output: "Hello, my name is John"

 

이 예제에서는 name과 age라는 두 개의 매개변수를 사용하는 Person이라는 생성자 함수를 정의했습니다.

 

생성자 함수 내에서 this 키워드를 사용하여 객체의 속성을 정의합니다. 콘솔에 메시지를 기록하는 sayHello 함수도 정의합니다. 마지막으로 new 키워드와 Person 생성자 함수를 사용하여 새 객체를 만듭니다.

 

 

JavaScript는 또한 프로토타입을 사용하여 상속을 지원합니다. 프로토타입은 다른 객체를 만들기 위한 템플릿으로 사용되는 객체입니다.

 

객체에서 속성이나 메서드가 호출되면 JavaScript는 먼저 객체 자체에서 해당 속성이나 메서드를 찾습니다. 찾지 못하면 객체의 프로토타입에서 찾습니다. 그래도 찾지 못하면 프로토타입의 프로토타입에서 찾는 식으로 프로토타입 체인의 끝에 도달할 때까지 계속합니다.

 

예를 들어 Person 객체와 Person 객체에서 상속되는 Student 객체를 만들어 보겠습니다.

// Define the Person class

class Person {

constructor(name, age) {

this.name = name;

this.age = age;

}



// Define a method

sayHello() {

console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);

}

}



// Define the Student class, which extends the Person class

class Student extends Person {

constructor(name, age, grade) {

// Call the parent constructor with super()

super(name, age);



this.grade = grade;

}



// Override the sayHello() method

sayHello() {

console.log(`Hello, my name is ${this.name}, I am ${this.age} years old, and I am in grade ${this.grade}.`);

}

}



// Create a new Person object

const person1 = new Person("Alice", 25);

person1.sayHello(); // Output: "Hello, my name is Alice and I am 25 years old."



// Create a new Student object

const student1 = new Student("Bob", 17, 11);

student1.sayHello(); // Output: "Hello, my name is Bob, I am 17 years old, and I am in grade 11."

 

이 예제에는 sayHello() 메서드가 있는 Person 클래스와 Person을 확장하는 Student 클래스가 있습니다. Student 클래스에는 grade 속성을 포함하는 sayHello() 메소드의 자체 구현이 있습니다.

 

Student 객체를 생성하기 위해 new Student()를 호출하고 필요한 인수를 전달합니다.

 

Student 객체는 name 및 age 속성과 sayHello() 메서드를 포함하여 Person 객체의 속성과 메서드를 상속합니다. 그러나 Student 객체에 대한 sayHello() 메서드는 grade 속성을 포함하도록 재정의됩니다.

 

상속과 같은 객체 지향 프로그래밍 원칙을 사용하면 코드를 단순화하고 유지 관리 및 업데이트를 쉽게 할 수 있습니다.