Skip to content

Commit c10322d

Browse files
Merge pull request #42 from yahma25/Translation-to-ko-playground-Objects-and-Arrays
Translate 1 file to ko - Objects and Arrays
2 parents 75f020a + 71bcb20 commit c10322d

File tree

1 file changed

+110
-0
lines changed

1 file changed

+110
-0
lines changed
Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
//// { order: 1, compiler: { strict: false } }
2+
3+
// JavaScript 오브젝트는
4+
// 이름이 있는 키로 래핑된 값의 모음입니다.
5+
6+
const userAccount = {
7+
name: "Kieron",
8+
id: 0,
9+
};
10+
11+
// 이런 오브젝트를 더 크고, 더 복잡한
12+
// 데이터 모델로 만들기 위해 합칠 수 있습니다.
13+
14+
const pie = {
15+
type: "Apple",
16+
};
17+
18+
const purchaseOrder = {
19+
owner: userAccount,
20+
item: pie,
21+
};
22+
23+
// 단어 몇 개를 마우스로 호버해보면 (purchaseOrder 위에 호버해보세요),
24+
// TypeScript가 JavaScript를 이름표가 붙은 타입으로
25+
// 어떻게 해석하는지 확인할 수 있습니다.
26+
27+
// 값은 "."를 통해 구매 주문에 대한 사용자 이름에
28+
// 접근할 수 있습니다:
29+
console.log(purchaseOrder.item.type);
30+
31+
// () 사이에 있는 코드의 각 부분에 마우스로 호버해보면,
32+
// TypeScript가 각 부분에 대해 더 많은 정보를 제공하는 것을 확인할 수 있습니다.
33+
// 아래에 다시 작성해보세요:
34+
35+
// 문자별로 다음 줄에 이것을 복사해보세요:
36+
//
37+
// purchaseOrder.item.type
38+
39+
// TypeScript는 이 파일에서 사용 가능한 JavaScript 오브젝트에 대한 피드백을
40+
// playground에 제공하며, 오타를 방지할 수 있게 해주고
41+
// 다른 곳에서 찾아볼 필요 없이
42+
// 추가 정보를 제공해줍니다.
43+
44+
// TypeScript는 배열에도 동일한 기능을 제공합니다.
45+
// 여기에 구매 주문만 포함된 배열이 있습니다.
46+
47+
const allOrders = [purchaseOrder];
48+
49+
// allOrders에 호버해보면,
50+
// 호버 정보가 []로 끝나기 때문에 배열이라는 것을 알 수 있습니다.
51+
// 인덱스(0부터 시작하는)와 함께 대괄호를 사용함으로써
52+
// 첫 번째 순서에 접근할 수 있습니다.
53+
54+
const firstOrder = allOrders[0];
55+
console.log(firstOrder.item.type);
56+
57+
// 오브젝트를 얻기 위한 다른 방법은
58+
// 오브젝트를 제거하기 위해 배열을 꺼내오는 것입니다.
59+
// 이렇게 하면 배열에서 오브젝트를 제거하고, 반환합니다.
60+
// 내부의 기존 데이터를 변경하므로
61+
// 배열을 변형한다고 불립니다.
62+
63+
const poppedFirstOrder = allOrders.pop();
64+
65+
// 이제 allOrders는 비어 있습니다.
66+
// 데이터를 변형하는 것은 여러모로 유용할 수 있습니다만,
67+
// 코드베이스의 복잡성을 줄이는 한 가지 방법은 변형을 방지하는 것입니다.
68+
// 대신에 TypeScript는 읽기 전용으로 배열을 선언하는 방법을 제공합니다:
69+
70+
// 구매 주문 형태를 기반으로 하는 타입을 생성합니다:
71+
type PurchaseOrder = typeof purchaseOrder;
72+
73+
// 구매 주문의 읽기 전용 배열을 생성합니다
74+
const readonlyOrders: readonly PurchaseOrder[] = [purchaseOrder];
75+
76+
// 맞아요! 확실히 코드가 좀 많습니다.
77+
// 여기에 4가지 새로운 것이 있습니다:
78+
//
79+
// type PurchaseOrder - TypeScript에 새로운 타입을 선언합니다.
80+
//
81+
// typeof - 다음에 전달되는 상수 기반의 타입을 설정하기 위해
82+
// 타입 추론 시스템을 사용합니다.
83+
//
84+
// purchaseOrder - 변수 purchaseOrder를 얻고
85+
// 이것이 주문 배열에 있는 모든 오브젝트의 형태라고
86+
// TypeScript에 알려줍니다.
87+
//
88+
// readonly - 이 오브젝트는 변형을 지원하지 않으며,
89+
// 한 번 생성되면 배열의 내용이
90+
// 항상 동일하게 유지됩니다.
91+
//
92+
// 이제 readonlyOrders에서 pop을 시도하면,
93+
// TypeScript는 오류를 발생시킵니다.
94+
95+
readonlyOrders.pop();
96+
97+
// 거의 모든 곳에서 readonly을 사용할 수 있으며,
98+
// 여기저기에 약간의 추가 문법이 있지만,
99+
// 많은 추가 안전성을 제공합니다.
100+
101+
// readonly에 대해 더 많이 알아볼 수 있습니다:
102+
// - https://www.typescriptlang.org/docs/handbook/interfaces.html#readonly-properties
103+
// - https://basarat.gitbooks.io/typescript/content/docs/types/readonly.html
104+
105+
// 그리고 함수 예시에서
106+
// JavaScript와 TypeScript에 대해 계속 배울 수 있습니다:
107+
// example:functions
108+
//
109+
// 또는 불변성에 대해 더 알고 싶다면:
110+
// example:immutability

0 commit comments

Comments
 (0)