<div id="readability-page-1" class="page"><div><h2 id="1-keyof">1. keyof</h2>
<pre><code>interface User {
 id: number;
 name: string;
 age: number;
 gender: "m" | "f";
}

type UserKey = keyof User;

const uk:UserKey = "age"</code></pre>
=&gt; js Object.keys와 비슷한듯 
<h2 id="2-partial-t">2. Partial&lt; T&gt;</h2>
<pre><code>interface User {
 id: number;
 name: string;
 age: number;
 gender: "m" | "f";
}
// interface User {
// id?: number;
// name?: string;
// age?: number;
// gender?: "m" | "f";
// }

let admin: Partial&lt;User&gt; = {
 id: 1,
 name: "Bob",
}</code></pre>
=&gt; 모든걸 optinal로 바꿔줌
<h2 id="2-required-t">2. Required&lt; T&gt;</h2>
<pre><code>interface User {
 id: number;
 name: string;
 age?: number;
 gender: "m" | "f";
}

// interface User {
// id: number;
// name: string;
// age: number;
// gender: "m" | "f";
// }

let admin: Required&lt;User&gt; = {
 id: 1,
 name: "Bob",
 age: 1,
 gender: "m",
}</code></pre>
<h2 id="3-recordk-t">3. Record&lt;K, T&gt;</h2>
<pre><code>type Grade = "1" | "2" | "3" | "4";
type Score = "A" | "B" | "C" | "D";

const score: Record&lt;Grade, Score&gt; = {
 1: "A",
 2: "C",
 3: "B",
 4: "D",
};</code></pre>
=&gt; Type을 변수로 저장해서 쉽게 관리하면서 쓸 수 있음
<pre><code>interface User {
 id: number;
 name: string;
 age: number;
}

function isValid(user: User) {
 const result: Record&lt;keyof User, boolean&gt; = {
 id: user.id&gt;0,
 name: user.name !== "",
 age: user.age &gt; 0,
 };
 return result;
}

let user: User = {
 id: 1,
 name: 'ts',
 age: 1,
}
console.log(isValid(user));</code></pre>
=&gt; valid에도 이렇게 활용 가능 
=&gt; 오. 좋네 생육기록 만들 때, 활용하면 좋을듯 
=&gt; 실제로 react form이 이런 형식이였던 것 같은
<h2 id="4-pickt-k">4. Pick&lt;T, K&gt;</h2>
<pre><code>interface User {
 id: number;
 name: string;
 age: number;
 gender: 'M' | 'W';
}

const admin: Pick&lt;User, "id" | "name"&gt; = {
 id: 0,
 name: "Bob",
}</code></pre>
<h2 id="5-omitt-k">5. Omit&lt;T, K&gt;</h2>
<pre><code>interface User {
 id: number;
 name: string;
 age: number;
 gender: 'M' | 'W';
}

const admin: Omit&lt;User, "age" | "gender"&gt; = {
 id: 0,
 name: "Bob",
}</code></pre>
=&gt; Pick과 반대로 얘네들 빼고
<h2 id="6-excludet1-t2">6. Exclude&lt;T1, T2&gt;</h2>
<pre><code>type T1 = string | number | boolean;
type T2 = Exclude&lt;T1, number | string&gt;;</code></pre>
<h2 id="7-nonnullable-type">7. NonNullable&lt; Type&gt;</h2>
<pre><code>type T1 = string | null | undefined | void;
type T2 = NonNullable&lt;T1&gt;;</code></pre></div></div>

2taesung.log

Taesung Lee

1. keyof
interface User {
 id: number;
 name: string;
 age: number;
 gender: "m" | "f";
}
type UserKey = keyof User;
const uk:UserKey = "age"
=> js Object.keys와 비슷한듯 
2. Partial< T>
interface User {
 id: number;
 name: string;
 age: number;
 gender: "m" | "f";
}
// interface User {
// id?: number;
// name?: string;
// age?: number;
// gender?: "m" | "f";
// }
let admin: Partial<User> = {
 id: 1,
 name: "Bob",
}
=> 모든걸 optinal로 바꿔줌
2. Required< T>
interface User {
 id: number;
 name: string;
 age?: number;
 gender: "m" | "f";
}
// interface User {
// id: number;
// name: string;
// age: number;
// gender: "m" | "f";
// }
let admin: Required<User> = {
 id: 1,
 name: "Bob",
 age: 1,
 gender: "m",
}
3. Record<K, T>
type Grade = "1" | "2" | "3" | "4";
type Score = "A" | "B" | "C" | "D";
const score: Record<Grade, Score> = {
 1: "A",
 2: "C",
 3: "B",
 4: "D",
};
=> Type을 변수로 저장해서 쉽게 관리하면서 쓸 수 있음
interface User {
 id: number;
 name: string;
 age: number;
}
function isValid(user: User) {
 const result: Record<keyof User, boolean> = {
 id: user.id>0,
 name: user.name !== "",
 age: user.age > 0,
 };
 return result;
}
let user: User = {
 id: 1,
 name: 'ts',
 age: 1,
}
console.log(isValid(user));
=> valid에도 이렇게 활용 가능
=> 오. 좋네 생육기록 만들 때, 활용하면 좋을듯
=> 실제로 react form이 이런 형식이였던 것 같은
4. Pick<T, K>
interface User {
 id: number;
 name: string;
 age: number;
 gender: 'M' | 'W';
}
const admin: Pick<User, "id" | "name"> = {
 id: 0,
 name: "Bob",
}
5. Omit<T, K>
interface User {
 id: number;
 name: string;
 age: number;
 gender: 'M' | 'W';
}
const admin: Omit<User, "age" | "gender"> = {
 id: 0,
 name: "Bob",
}
=> Pick과 반대로 얘네들 빼고
6. Exclude<T1, T2>
type T1 = string | number | boolean;
type T2 = Exclude<T1, number | string>;
7. NonNullable< Type>
type T1 = string | null | undefined | void;
type T2 = NonNullable<T1>;

[ts] utility type

댓글