Multi Developer SuHo

자바스크립트 클래스(Class) 정의 본문

JavaScript

자바스크립트 클래스(Class) 정의

Dreaming Developer Student 2023. 10. 7. 20:12
SMALL

모든  내용과 소스들은 다음과 같은 강의 플랫폼에서 응용하여  작성하였습니다.
출처: https://inf.run/xNcEg
이번에는 자바스크립트에서 중요한 클래스에 대해서 알아보겠습니다. 클래스란 키워드는 Java나 C언어등 다양한 언어에서 사용되는 키워드입니다. 

 

[무료] [코드팩토리] [입문] 9시간만에 끝내는 코드팩토리의 Javascript 무료 풀코스 - 인프런 | 강의

이 강의 하나만으로 인기 Javascript 프레임워크들과 Typescript를 배울 수 있는 기본을 다질 수 있습니다., 자바스크립트 문법 마스터,9시간 만에 무료로 할 수 있어요! ✨ 자바스크립트 문법,한 강의

www.inflearn.com

자바스크리브에서 클래스(Class)는 객체 지향 프로그래밍(OOP)의 핵심 개념중 하나로, 객체를 생성하기 위한 템플릿이며, 해당 클래스로부터 생성된 객체들은 동일한 속성과 메서드를 공유합니다.

 

쉽게 이해하기 위해 예를 든 소스코드를 가져왔습니다. 

 

IdolModel  클래스를 정의하고 생성한 소스코드 입니다. 

class IdolModel{ //클래스로 인스턴스를 생성하면 클래스에 해당되는 객체가 생성
   name; 
   year;

    constructor(name, year){
        this.name = name; // this 키워드는 현재 인스턴스(객체)
        this.year = year; // new 키워드를 이용한 생성되는 객체

  }

 

각 변수마다 "IdolMdel" 이라는 새로운 객체(instance)를 생성한 소스코드입니다.

// constructor - 생성자

const winter = new IdolModel('윈터', 2001); //'winter'라는 변수에  'IdolModel'이라는 새로운 인스턴스 생성
console.log(winter);
const karina = new IdolModel('카리나', 2000);
console.log(karina);
const giselle = new IdolModel('지젤', 2000);
console.log(giselle);
const ningning = new IdolModel('닝닝', 2002);
console.log(ningning);

console.log(winter.name);
console.log(winter.year);

 

sayName() 이라는 메서드를 생성하고  sayName 메서드에  할당된 값을 호출하는 소스코드입니다.

 sayName(){
    return `안녕하세요 저는 ${this.name}입니다.`;
  }
  
  console.log(winter.sayName()); //클래스의 인스턴스는 객체이다
console.log(karina.sayName());
console.log(giselle.sayName());
console.log(ningning.sayName());

 

 

이렇게 클래스를 정의하고 클래스를 호출하는 클래스 기본에 알아보았습니다. 

LIST