Javascript

[모자딥]Class

index.ys 2023. 12. 2. 00:02

예제 25.01

  • Person 변수를 선언하고 즉시실행되는 IIFE함수 실행
  • 생성자와 프로토타입 메서드를 캡슐화함
// ES5 생성자 함수
// Person변수 선언, 즉시 실행되는 함수인 IIFE, 함수는 생성자와 프로토타입 메서드를 캡슐화
var Person = (function () {
    // 생성자 함수 Person, name이라는 매개변수를 받아 새로 생성된 객체의 name 속성에 할당함
    function Person(name, age) {
        this.name = name;
        this.age = age
    }

    // 프로토타입 메서드
    // Person 생성자의 프로토타입 sayHi라는 메서드 추가
    // 이 메서드는 콘솔에 메세지를 로깅하는데, 메세지 안에 name 속성이 포함됨
    Person.prototype.sayHi = function () {
        console.log('Hi! My name is ' + this.name);
        console.log('im' + this.age + 'age');
    };

    // 생성자 함수 반환
    //전체 IIFE가 Person 생성자를 반환
    return Person;

}());

//new Person 객체생성
var me = new Person('Lee', 18);
me.sayHi(); // Hi! My name is Lee\


//IIFE : Immediately Invoked Function Expression
//자바스크립트에서 함수를 정의하고 즉시 실행되는 함수 표현식
(function () {
    const 현재시간 = new Date
    console.log(현재시간.toLocaleString())
})();

IIFE함수

  • IIFE는 "Immediately Invoked Function Expression"의 약어로, 즉시 실행되는 함수 표현식
  • 함수의 선언과 동시에 호출됨
(function() {
    return 1+1
})();


(() => {
  return 1+1
})();

(async () => {
 return await 1+1
})();

파스칼 케이스

  • 단어의 앞글자만 대문자로 표현하는 방법
  • class의 선언시 맨앞글자만 대문자로 표기하는 파스칼 케이스를 사용함
class Person{

}

class Color{

}

 

예제 25.04

  • class 문법으로 Person 클래스 선언
  • constructor로 인스턴스 생성 및 초기화
  • sayHi라는 프로토타입 메서드 선언
// 클래스 선언문
class Person {
    // 생성자
    constructor(name) {
        // 인스턴스 생성 및 초기화
        this.name = name; // name 프로퍼티는 public하다.
    }

    // 프로토타입 메서드
    // 클래스의 인스턴스에 속하는 메서드
    // 각 인스턴스에 대해 별도의 메모리르 차지하지 않고 클래스의 프로토타입에 저의됨
    // 인스턴스의 상태를 조작하거나 인스턴스와 관련된 동작을 수행
    // 클래스로 생성된 모든 인스턴스에서 공유됨
    // sayHi메서드는 프로토타입 메서드로 Person 인스턴스에서 공통으로 사용됨
    sayHi() {
        console.log(`Hi! My name is ${this.name}`);
    }

    // 정적 메서드
    // 클래스 자체에 속하는 메서드
    // 클래스의 인스턴스와는 관련 x 클래스 수준의 동작을 수행하는데 사용됨
    // 인스턴스를 생성하지 않고도 클래스 이름을 통해 직접호출 가능
    static sayHello() {
        console.log('Hello!');
    }
}

// 인스턴스 생성
const me = new Person('Lee');

// 인스턴스의 프로퍼티 참조
console.log(me.name); // Lee
// 프로토타입 메서드 호출
me.sayHi(); // Hi! My name is Lee
// 정적 메서드 호출
Person.sayHello(); // Hello!