속성과 메소드

속성과 메소드

속성과 메소드는 객체 안에 들어가 있는 2가지 종류의 데이터다.
속성 : 실제 순수한 데이터
메소드 : 코드의 묶음인 함수가 들어가 있는 속성

type MyObject = {
	name: string;
    age: number;
    getFamilyName: () => string;
    getLastName: () => string;
    getBloodType: () => string;
}

const obj: MyObject = {
	name: 'gun o',
    age: 26,
    getFamilyName: function() { // 메소드 기술방법 1
    	return 'byun';
    }
    getBloodType() { // 메소드 기술방법 2
    	return 'B';
    }
    getLastName: () => 'byun'; // 메소드 기술방법 3
};
//객체에 접근하는 방법
obj.name; // 'gun o'
obj.age; // 26
obj.getFamilyName(); // 'byun'
obj.getBloodType(); // 'B'

위 코드에서 나이를 바꾸고 싶으면

obj.age = 24;
obj.age = -25;

값을 입력하면 되지만 -25같은 경우 나이에 있을 수 없는 숫자이므로 이를 방지해야한다.
속성 같은 경우에는 막을 방법이 없다. 이렇게 문제가 있는 값을 세팅하는 것을 막고 싶을 때,
Setter와 Getter를 이용해 객체 내부적으로는 실제 함수이지만 객체 외부에서는 속성처럼 보이도록 하면 방지할 수 있다.

Getter, Setter

클래스는 객체를 만드는 방법 중 하나이다. (인스턴스 객체 생성)

//인스턴스와 클래스
class Person {
	_bloodType: string; // class내 함수와 이름이 같지 않기 위해 '_'추가
    contructor(bloodType: string){ // 생성자
    	this._bloodType = bloodType;
    }
    
    set bloodType(btype: string) {
    	if(btype === 'A' || btype === 'AB' || btype === 'B' || btype === 'O'){
    		this._bloodType = bType
        }
    }
    
    get bloodType(){
    	return `${this._bloodType}`;
    }
}

const p1 = new Person('B');
p1.bloodType; // get이 없으면 코드는 작동하지 않는다
p1.bloodType = 'C'; // Error
p1.bloodType = 'O'; // setter를 통해 속성 접근

객체 리터럴로 만들었던 객체 obj와 인스턴스 오브젝트인 p1은 동일하다.
p1에 값을 바꾸고 싶으면 p1.bloodType = '혈액형'으로 넣을 수 있다.
하지만 혈액형에는 C형이 없기 때문에 A,B,AB,O만 들어가고 싶으면 Getter와 Setter를 사용해야한다.

메소드 앞에 set을 붙여 주면 외부에서는 속성을 접근하는 것처럼 동작한다
메소드 앞에 get을 붙여 주고 return하고 싶은 값을 넣으면 값을 조회할 수 있다.

Getter와 Setter는 일반 객체에서는 만들 수 없으며 클래스로 만들어진 인스턴스 객체에서 만들 수 있는 기능이다.
내부의 어떤 객체의 값을 보호하면서 외부에는 사용하는 편의성을 그대로 유지시켜준다.

객체 구성

구성 : 새로 추가하거나 삭제하는 기능

obj.bloodType = 'A'; // 추가
delete obj.name; // 삭제

delete의 경우 name?: string; ?가 붙어있을 경우에만 삭제 가능하다 (Typescript)
Javascript에서는 그냥 삭제가 가능하다.

javascript에서 객체 생성 또 다른 방법(create)

const myObj = Object.create(null, { // 타입 정의 문법 (javascript에서의)
	name: {
    	value: 'Byun guno',
        writable: true, // 값 변경 가능 기능 false인 경우 readOnly가 된다.
        configurable: false, // 값을 삭제할 수 없다. true는 delete 연산자 작동 가능
    }
})