diff --git a/2week/assignment/01.ts b/2week/assignment/01.ts index 343b004..c679469 100644 --- a/2week/assignment/01.ts +++ b/2week/assignment/01.ts @@ -5,3 +5,46 @@ const person = { country: 'ko', sex: 'male', }; + + +type arr1 = ['a', 'b', 'c'] +type arr2 = [1, 2, 3] + +// type Arr = T; +// type First = T extends Arr ? A : any; + +// type First = T[0] // 가능 +// never[] <-- 진정한 빈 배열 +// type First = T extends never[] ? never : T[0]; +type First = T extends [infer F, ...unknown[]] ? F : never + +type head1 = First; +type head2 = First; + +type Last = T extends [...unknown[], infer L] ? L : never + +type tail1 = Last; +type tail2 = Last; + + + + +type Fn = (...args:A) => any; +type FnArgs = T extends Fn ? A : any; + +function test(name: number) { + // 값 공간 + return 3 +} +type TestFn = FnArgs; + + +type StrFn = (input: string) => string; +const getSHA: StrFn = (input: string) => { + return input; +}; + +type PromiseFn = T extends (...args: infer A) => infer R ? (...args: A) => Promise : T; +const getSHAAsync: PromiseFn = (input: string) =>{ + return new Promise((res) => input); +} diff --git a/3week/assignment/01.ts b/3week/assignment/01.ts new file mode 100644 index 0000000..364c66a --- /dev/null +++ b/3week/assignment/01.ts @@ -0,0 +1,25 @@ +/** + * 문제1 + * 다음의 파파고 번역 api 명세를 확인하고 + * 파라미터에 필요한 source 와 target 을 좁혀주세요. + * @description: 링크: https://developers.naver.com/docs/papago/papago-nmt-api-reference.md + * */ + +type SupportedLanguague = +|'ko' +|'en' +|'ja' +|'zh-CN' +|'zh-TW' +|'vi' +|'id' +|'th' +|'de' +|'ru' +|'es' +|'it' +|'fr'; + + +type PapagoParamsSource = SupportedLanguague; +type PapagoParamsTarget = SupportedLanguague; diff --git a/3week/assignment/02.ts b/3week/assignment/02.ts new file mode 100644 index 0000000..9a77018 --- /dev/null +++ b/3week/assignment/02.ts @@ -0,0 +1,34 @@ +/** + * 문제2 + * 위의 PapagoParamsSource와 PapagoParamsTarget 를 조합하여 명세에서 언급하는 + * "번역할 수 있는 원본 언어와 목적 언어는 다음과 같습니다." 의 제약조건을 참고하여 PapagoParams 인터페이스를 개선해 주세요. + * */ + +interface KoParams { + source: 'ko'; + target: SupportedLanguague; + text: string; +} +interface EnParams { + source: 'en'; + target: 'ja'|'fr'|'zh-CN'|'zh-TW'|'ko'; + text: string; +} +interface JaParams { + source: 'ja'; + target: 'zh-CN' | 'zh-TW' | 'ko'; + text: string; +} +interface ZhCnParams { + source: 'zh-Cn'; + target: 'zh-TW'; + text: string; +} + +type PapagoParams = KoParams | EnParams | JaParams | ZhCnParams; + +const params: PapagoParams= { + source: 'en', + target: 'ja', + text: 'Hello Typescript!' +} diff --git a/3week/assignment/03.ts b/3week/assignment/03.ts new file mode 100644 index 0000000..b468a17 --- /dev/null +++ b/3week/assignment/03.ts @@ -0,0 +1,40 @@ +/** + * 문제3 + * 스탑워치 구현을 보고 ui 상태 interface 설계를 개선해주세요. + * https://online-stopwatch.ko.downloadastro.com/tools/ + * */ + +// 예시 인터페이스이고, 본인이 생각하는 더 나은 인터페이스로 바꾸셔도 됩니다. +interface TimeInfo { + lappedTimeList?: string[]; + timeFormStart: string; + timeFormLastLap: string; +} +interface ButtonStyle { + color: string; + icon: string +} + +interface Initalized extends TimeInfo { + type: 'initialized'; + startButton: ButtonStyle; +} +interface Running extends TimeInfo { + type: 'running'; + pauseButton: ButtonStyle; + addLapButton: ButtonStyle; +} +interface Paused extends TimeInfo { + type: 'paused'; + startButton: ButtonStyle; + resetButton: ButtonStyle; +} +type StopWatchState = Initalized | Running | Paused; + +const initialState: StopWatchState = { + type: 'initialized', + startButton: { color: 'awf', icon: 'waef' }, + timeFormStart: '0:00', + timeFormLastLap: '0:00', + lappedTimeList: [] +} diff --git a/3week/assignment/04.ts b/3week/assignment/04.ts new file mode 100644 index 0000000..4e39040 --- /dev/null +++ b/3week/assignment/04.ts @@ -0,0 +1,76 @@ +/** + * 문제4 + * 요구사항: naver나 kakao 로그인(Oauth2.0)하기 기능 이용해 + * 유저의 이름, 닉네임, 프로필 사진을 얻어와 출력하려고 합니다. + * + * 카카오 사용자 정보 가져오기 api 명세세 + * https://developers.kakao.com/docs/latest/ko/kakaologin/rest-api#req-user-info + * 카카오 profile 객체 스키마 + * https://developers.kakao.com/docs/latest/ko/kakaologin/rest-api#profile + * + * 네이버 프로필 API 호출하기 명세 + * https://developers.naver.com/docs/login/devguide/devguide.md#3-4-5-%EC%A0%91%EA%B7%BC-%ED%86%A0%ED%81%B0%EC%9D%84-%EC%9D%B4%EC%9A%A9%ED%95%98%EC%97%AC-%ED%94%84%EB%A1%9C%ED%95%84-api-%ED%98%B8%EC%B6%9C%ED%95%98%EA%B8%B0 + * + * 위의 명세를 참고하여 다음과 같은 타입을 정의했습니다. + * */ + +interface KakaoUserProfile { + nickname: string; + profile_image_url: string; +} + +interface KakaoUser { + name: string; + profile: KakaoUserProfile; +} + +interface NaverUser { + nickname: string; + name: string; + profile_image: string; +} +interface UserInfo { + name: string; + nickname: string; + profileImage: string; +} + +declare function getUser(userId: string): NaverUser | KakaoUser; + +const isKakaoUser = (user: NaverUser | KakaoUser): user is KakaoUser => { + return 'profile' in user; +} + +const getUserInfo = (userId: string): UserInfo => { + const userInfo: UserInfo = { + name: '', + nickname: '', + profileImage: '', + } + const response = getUser(userId); + if (isKakaoUser(response)) { + const { name, profile: { nickname, profile_image_url }} = response + userInfo.name = name; + userInfo.nickname = nickname; + userInfo.profileImage = profile_image_url; + } else { + const { nickname, name, profile_image } = response + userInfo.name = name; + userInfo.nickname = nickname; + userInfo.profileImage = profile_image; + } + return userInfo +} + +// 다음 오류를 해결하기위해 할 수 있는 모든 대안을 적용해주세요. +function renderUserProfile(userId: string) { + const app = document.querySelector('#app')!; + const user = getUserInfo(userId); + app.innerHTML = ` +
+ 이름: ${user.name} + 닉네임: ${user.nickname} + +
+ `; +} diff --git a/3week/assignment/05.ts b/3week/assignment/05.ts new file mode 100644 index 0000000..6f70ee6 --- /dev/null +++ b/3week/assignment/05.ts @@ -0,0 +1,33 @@ +/** + * 문제5 + * 회원가입 form을 만들어야합니다. + * 아이디, 비밀번호, 비밀번호 확인 text input + * 추가 정보입력 checkbox + * (추가정보입력을 체크하면) + * 주소, 전화번호 text input 을 구현하려고 합니다. + * 타입을 좀 더 좁게 관리할 수 있도록 개선해주세요. + * */ +interface AdditionalInfo { + address: string; + phone: string; +} + +interface BaseData { + id: string; + password: string; + confirmPassword: string; +} +interface SignUpData extends BaseData { + additionalInfo?: AdditionalInfo +} + +declare function postSignUpToV1(signupForm: SignUpData): void; +declare function postSignUpToV2(signupForm: SignUpData): void; + +const sendSignup = (formData: SignUpData) => { + if (formData.additionalInfo) { + postSignUpToV2(formData); + } else { + postSignUpToV1(formData); + } +};