728x90
union type 유니언타입 : 파라미터나 변수에 하나이상의 타입을 쓰고싶을때
function logMessage(value: string | number){
console.log(value);
}
logMessage('hello');
logMessage(100);
타입 가드: 특정 타입으로 타입의 범위를 좁혀 나가는(필터링 하는)과정
var seho: string | number | boolean;
function logMessage(value: string|number){
//console.log(value);
if(typeof value === 'number'){
value.toLocaleString(); //유니언타입의 장점?
}
if(typeof value === 'string'){
value.toString();
}
//string과 number가 아닌 거에 대해서 에러를 발생시킬수있다.
throw new TypeError('에러메세지');
}
logMessage('hello');
logMessage(100);
< 유니언 타입의 특징>
공통된 것만 접근할수있다 !!!
interface Developer {
name: string;
skill: string;
}
interface Person {
name: string;
age: number;
}
function askSomeone(someone: Developer | Person){
//skill과 age는 접근할수없다!!!!
//skill과 age를 사용하고 싶으면 if문 써야한다!
someone.skill; //에러
someone.age; //에러
//name만 접근할수있다
someone.name; //가능
}
< 인터셉션 타입 (&) 소개 >
인터셉션 타입 => 그리고 그리고 그리고 개념으로 생각해라. and and and
var capt: string & number & boolean;
// and의 의미이다.그래서 여기는 never
function askSomeone(someone: Developer | Person){
//여기서는 교집합 개념
someone.name;
}
function askSomeone(someone: Developer & Person){
someone.name;
someone.skill;
someone.age;
//여기서는 합집합 개념이다.
//근데 이해가 안가...... 아까는 밑에서 교집합개념이라며.....
}
저 위에 혼란스러운 부분을 정리하자!!!
interface Developer {
name: string;
skill: string;
}
interface Person {
name: string;
age: number;
}
저렇게 타입이 정해져있다고 하자.
객체로 쓰일때
-유니언타입(|)은 둘의 공동적인건 꼭 들어있어야한다. (name은 꼭 들어있어야하고, 다른건 추가적으로 들어가도 안들어가도 상관없다.)
-인터섹션타입(&)은 전체 다 있어야한다.(name, skill, age)
리터럴형식으로 쓰일때
-유니언타입(|)은 or의미이다.
-인터섹션타입(&)은 다 공통으로 있어야한다.(공통적인게 없으면 never)
function askSomeone(someone: Developer | Person){
someone.name;
}
function askSomeone(someone: Developer & Person){
someone.name;
someone.skill;
someone.age;
}
var seho: string | number | boolean; //or의미
var capt: string & number & boolean; //never
<유니언타입과 인터섹션 타입의 차이점>
function askSomeone(someone: Developer | Person){
}
askSomeone({ name:'디벨로퍼', skill: '웹 개발'});
askSomeone({ name:'디벨로퍼', age: 100});
function askSomeone(someone: Developer & Person){
someone.name;
someone.skill;
someone.age;
}
askSomeone({ name:'디벨로퍼', skill: '웹 개발', age: 100});
728x90