개발야옹

Typescript를 사용할 때는 .ts

React Component의 경우 .tsx 

public 

public은 default값이다. 생략이 가능하다.

class User{
	public name : string = "kim";
    // public => 모든 자식들이 name을 이용가능하다.
    // public keyword는 생략 가능 default 값이다.
    // public <-> private
	constructor(a : string){
    	this.name = a; 
    }
    
    public 함수(){
    	console.log(this.name);
    };
}

let user1 = new User("park");
user1.name = "Lee";

public은 축약을 제공하기도 한다. 

class User{
	constructor( public name : string, public age : number){
    }
}

let user1 = new User("Yeonji", 22);
console.log(user1); // { name : "Yeonji", age : 22 }

private

class 내부에서만 사용이 가능하며, class 외부에서는 직접적으로 접근이 불가능하다. 또한, extends로 해당 class를 상속받은 자식 class도 사용이 불가능하다.

class User{
	private name : string = "kim";
    // private => class 내부에서만 사용가능하게 된다. 자식들이 직접 사용 불가능.
	constructor(a : string){
    	this.name = a; 
    }
    
    public ChangeName(a : string) : void{
    	this.name = a;
    };
}

let user1 = new User("park");
user1.name = "Lee"; // error 발생
user1.ChangeName("Lee"); // success

protected

protected는 private keyword와 같이 class{} 내부에서만 사용이 가능하다. 그러나 private과 반대로 extends로 상속받은 class 내부에서도 사용이 가능하다.

class Parent{
	protected x = 10;
    private y = 30;
}

class Baby extends Parent{
	doIt(){
    	this.x = 30; // success
        this.y = 20; // error
    }
}

static

static ketyword를 붙은 것은 자식에게 물려주지않음. 부모 class만 사용이 가능하다.

static은 private, public, protected와 동시에 사용이 가능하다.

class Person{
	static x = 10;
    y = 100;
}

let person1 = new Person();
console.log(person1); // x 는 보이지 않음

rest parameter ( spread operator ... )

function myFunction(...a){

}

myFunction(1,2,3,55,12);
myFunction(5,2,3);

// (...a)가 rest parameter이며, rest parameter는 다른 parameter 귀에 작성해야한다.
// rest parameter는 전부 array로 받아오게된다.

rest parameter type 지정

function 함수( ...a : number[] ){
	console.log(a);
}

함수(1,2,3,5,2,5,6);

spread operator ( ... )

괄호를 벗겨준다.

let array1 = [1,2];
let array2 = [3,4,5];
let array3 = [ ...array1, ...array2 ];
// array3 === [1,2,3,4,5]

destructuring

let [ x, y ] = ["hello", 404]; // destructuring

console.log(x); // "hello"
console.log(y); // 404

let { name, age } = { name : "Yeonji", age : 22 } // destructuring

function 함수( { name, age, address } : { name : string, age : number, address : string } ) //destructuring
	console.log( name, age, address );
}

함수({ name : "Minseo", age : 21, address : "Seoul" });

interface

interface의 장점

- extends로 복사가 가능하다.

- 중복 선언이 가능하다. => 자동 extends가 된다.

- extends했을 때 중복 속성이 생기면 미리 error 발생

- type의 경우 중복 속성이 미리 발생하지 않는다. 

interface Person{
	name : string;
    age : number;
}

interface User extends Person{
	email : string;
    phone : string;
}

let Yeonji : Person = { name : "Yeonji", age : 22 };
let Sujin : User = { name : "Sujin", age : 22, email :"sujin@mmm.com", phone : "010-2222-2222" };

 type vs interface