위 소스에서 T1은 string, number, 인자 없는 함수, 인자 있고 return 있는 함수 중 함수의 형태만 타입으로 가질 수 있다.
test6은 return 이 없는 함수고 test7은 string이라 에러가 난다.
NonNullable<Type>
: Type에 들어오는 타입 중 null, undefined를 제한 타입만 가능하다
type T0 = NonNullable<string | number | undefined>;
// T0는 string, number만 가능
type T1 = NonNullable<string[] | null | undefined>;
// T1은 string[]만 가능
Parameters<Type>
: 함수의 파라미터를 타입으로 리턴한다.
declare function f1(arg: { a: number; b: string }): void;
type T0 = Parameters<() => string>;
// T0 = []
type T1 = Parameters<(s: string) => void>;
// T1 = [s:string]
type T2 = Parameters<<T>(arg: T) => T>;
// T2 = [arg: unknown]
type T3 = Parameters<typeof f1>;
// T3 = [arg: { a: number; b: string }]
type T4 = Parameters<any>;
// T4 = unknown[]
// never는 any를 제외한 모든 타입의 원시타입이기때문에
// 함수타입 T에 never로 주어도 에러가 발생하지 않음
type T5 = Parameters<never>;
// T5 = never
type T6 = Parameters<string>;
// 에러
type T7 = Parameters<Function>;
// 에러
위 소스에서 T6, T7은 '(...args: any) => any'의 형식이 아니라서 에러가 난다. 즉 Parameters가 인자로 받을 수 있는 것은 모든 파라미터를 인자로 받고 결괏값으로 모든 값을 리턴하는, 사실상 모든 함수가 된다.
ConstructorParameters<Type>
: 생성자를 갖는 함수 타입의 생성자 파라미터를 리턴한다. 함수가 아니라면 never를 리턴한다. 위 Parameters와 비슷하지만 생성자 파라미터로 한정한다.
type T0 = ConstructorParameters<ErrorConstructor>;
// T0 = [message?: string | undefined]
type T1 = ConstructorParameters<FunctionConstructor>;
// T1 = string[]
type T2 = ConstructorParameters<RegExpConstructor>;
// T2 = [pattern: string | RegExp, flags?: string | undefined]
type T3 = ConstructorParameters<any>;
// T3 = unknown[]
//에러발생
type T4 = ConstructorParameters<Function>;
// T4 = never
============
class Person {
private _firstname: string
private _lastname: string
constructor(firstname: string, lastname: string) {
this._firstname = firstname
this._lastname = lastname
}
}
type typeIs = ConstructorParameters<typeof Person>;
let personConstructionArgs: typeIs = ['first', 'last']
ReturnType<Type>
: 함수의 리턴타입을 가져온다.
declare function f1(): { a: number; b: string };
type T0 = ReturnType<() => string>;
// T0 = string
type T1 = ReturnType<(s: string) => void>;
// T1 = void
type T2 = ReturnType<<T>() => T>;
// T2 = unknown
type T3 = ReturnType<<T extends U, U extends number[]>() => T>;
// T3 = number[]
type T4 = ReturnType<typeof f1>;
// T4 = { a: number; b: string }
type T5 = ReturnType<any>;
// T5 = any
type T6 = ReturnType<never>;
// T6 = never;
//에러
type T7 = ReturnType<string>;
// T7 = any
type T8 = ReturnType<Function>;
// T8 = any
InstanceType<Type>
: 생성자로 초기화된 인스턴스 타입을 리턴한다.
class C {
x = 0;
y = 0;
}
type T0 = InstanceType<typeof C>;
// T0 = C
const test :T0 = {x: 1, y: 3, z: 2} // 에러
type T1 = InstanceType<any>;
// T1 = any
type T2 = InstanceType<never>;
// T2 = never
// 에러
type T3 = InstanceType<string>;
// T3 = any
type T4 = InstanceType<Function>;
// T4 = any
ThisParameterType<Type>
: 함수 타입의 this 파라미터의 type을 가져온다. this를 가지지 않는 함수 타입이면 unknown을 반환한다.
function toHex(this: Number) {
return this.toString(16);
}
type T = ThisParameterType<typeof toHex>;
// T = Number
function numberToString(n: ThisParameterType<typeof toHex>) {
return toHex.apply(n);
}
OmitThisParameter<Type>
: 타입의 this 파라미터를 무시한다. 타입에 this가 없으면 그냥 Type이다. 있으면 this가 없는 Type 이 만들어진다.
function toHex(this: Number) {
return this.toString(16);
}
console.log(toHex.call(2)); //2
type T = OmitThisParameter<typeof toHex>;
// T = () => string
const fiveToHex: T = toHex.bind(16);
console.log(fiveToHex()); //10
이벤트 종료 처리를 위해 날짜 비교 로직을 스크립트에 넣었는데, IE에서만 제대로 실행되지 않는 문제가 있었다.
콘솔에 딱히 에러가 없었는데, 찾아보니 IE에서는 안된다고 잘 알려진 이슈였다.
var nowTime = new Date();
var endTime = new Date("2022-04-26 10:00:00"); //invalid date in IE
if (nowTime > endTime){
//alert("이벤트가 종료되었습니다. 감사합니다.");
location.href = 'naver.com'
}
그러면 어떻게 해야 IE가 알아볼까 싶어서 찾아봤는데, 제일 쉽게 수정할 수 있는 방법은 Date constructor를 사용하는 방법이었다.
var nowTime = new Date();
//var endTime = new Date("2022-04-26 10:00:00"); //invalid date in IE
//var endTime = new Date(2022, 4, 26, 10, 00, 00); //May로 표시됨 0이 1월...
var endTime = new Date(2022, 3, 26, 10, 00, 00);
if (nowTime > endTime){
//alert("이벤트가 종료되었습니다. 감사합니다.");
location.href = 'naver.com'
}
다만 조심해야하는 것은 monthIndex가 0부터 시작하기 때문에 4월은 3으로, 12월은 11로 표시해야 한다. 그리고 시간은 24시간 체계이다.
new Date(year, monthIndex, day, hours, minutes, seconds)
