Merge branch 'main' into translation/everyday-types

Author: cadenzah

attribution.json

@@ -34,6 +34,24 @@ const todo2 = updateTodo(todo1, {
 });
 ```
 
+## `Required<Type>`
+
+`Type` 집합의 모든 프로퍼티를 필수로 설정한 타입을 생성합니다. [`Partial`](#partialtype)의 반대입니다.
+
+##### 예제
+
+```ts twoslash
+// @errors: 2741
+interface Props {
+  a?: number;
+  b?: string;
+}
+
+const obj: Props = { a: 5 };
+
+const obj2: Required<Props> = { a: 5 };
+```
+
 ## `Readonly<Type>`
 
  `Type` 집합의 모든 프로퍼티`읽기 전용(readonly)`으로 설정한 타입을 생성합니다, 즉 생성된 타입의 프로퍼티는 재할당될 수 없습니다.
@@ -279,24 +297,6 @@ type T4 = InstanceType<Function>;
 //    ^?
 ```
 
-## `Required<Type>`
-
-필요한 `T`집합의 모든 프로퍼티로 구성된 타입을 생성합니다.  [`Partial`](#partialtype) 의 반대쪽.
-
-##### 예제
-
-```ts twoslash
-// @errors: 2741
-interface Props {
-  a?: number;
-  b?: string;
-}
-
-const obj: Props = { a: 5 };
-
-const obj2: Required<Props> = { a: 5 };
-```
-
 ## `ThisParameterType<Type>`
 
 함수 타입의 [this](/docs/handbook/functions.html#this-parameters) 매개변수의 타입, 또는 함수 타입에 `this`매개변수가 없을 경우 [unknown](/docs/handbook/release-notes/typescript-3-0.html#new-unknown-top-type) 을 추출합니다.
@@ -369,4 +369,13 @@ obj.moveBy(5, 5);
 
 ## 내장 문자열 조작 타입
 
-템플릿 문자열 리터럴 주변의 문자열 조작을 돕기 위해, TypeScript는 타입 시스템 내에서 문자열 조작에 사용할 수 있는 타입 집합이 포함되어 있습니다. 할 수 있어요
+### `Uppercase<StringType>`
+
+### `Lowercase<StringType>`
+
+### `Capitalize<StringType>`
+
+### `Uncapitalize<StringType>`
+
+템플릿 문자열 리터럴에서의 문자열 조작을 돕기 위해, TypeScript는 타입 시스템 내에서 문자열 조작에 사용할 수 있는 타입 집합이 포함되어 있습니다. 
+[이 링크](/docs/handbook/2/template-literal-types.html#intrinsic-string-manipulation-types)에서 예제를 확인하세요.

docs/documentation/ko/handbook-v2/Basics.md

@@ -0,0 +1,115 @@
+---
+title: tsconfig.json 是什么
+layout: docs
+permalink: /zh/docs/handbook/tsconfig-json.html
+oneline: 了解 TSConfig 的工作原理
+translatable: true
+---
+
+## 概览
+
+当目录中出现了 `tsconfig.json` 文件，则说明该目录是 TypeScript 项目的根目录。`tsconfig.json` 文件指定了编译项目所需的根目录下的文件以及编译选项。
+
+JavaScript 项目可以使用 `jsconfig.json` 文件，它的作用与 `tsconfig.json` 基本相同，只是默认启用了一些 JavaScript 相关的编译选项。
+
+一个项目将以下列之一的方式编译：
+
+## 使用 `tsconfig.json` 或者 `jsconfig.json`
+
+- 在调用 tsc 命令并且没有其它输入文件参数时，编译器将由当前目录开始向父级目录寻找包含 tsconfig 文件的目录。
+
+- 调用 tsc 命令并且没有其他输入文件参数，可以使用 `--project` （或者只是 `-p`）的命令行选项来指定包含了 `tsconfig.json` 的目录，或者包含有效配置的 `.json` 文件路径。
+
+当命令行中指定了输入文件参数， `tsconfig.json` 文件会被忽略。
+
+## 示例
+
+`tsconfig.json` 文件示例：
+
+- 使用 `files` 属性
+
+  ```json tsconfig
+  {
+    "compilerOptions": {
+      "module": "commonjs",
+      "noImplicitAny": true,
+      "removeComments": true,
+      "preserveConstEnums": true,
+      "sourceMap": true
+    },
+    "files": [
+      "core.ts",
+      "sys.ts",
+      "types.ts",
+      "scanner.ts",
+      "parser.ts",
+      "utilities.ts",
+      "binder.ts",
+      "checker.ts",
+      "emitter.ts",
+      "program.ts",
+      "commandLineParser.ts",
+      "tsc.ts",
+      "diagnosticInformationMap.generated.ts"
+    ]
+  }
+  ```
+
+- 使用 `"include"` 和 `"exclude"` 属性
+
+  ```json  tsconfig
+  {
+    "compilerOptions": {
+      "module": "system",
+      "noImplicitAny": true,
+      "removeComments": true,
+      "preserveConstEnums": true,
+      "outFile": "../../built/local/tsc.js",
+      "sourceMap": true
+    },
+    "include": ["src/**/*"],
+    "exclude": ["node_modules", "**/*.spec.ts"]
+  }
+  ```
+
+## 基本的 TSConfig
+
+根据你要在其中运行代码的不同的 JavaScript 运行时环境，你可以在 [github.com/tsconfig/bases](https://github.com/tsconfig/bases/) 上寻找一个合适的基本配置。
+你可以通过扩展这些已经处理过不同的 JavaScript 运行时环境的 `tsconfig.json` 文件来简化你项目中的 `tsconfig.json`。
+
+举个例子，如果你的项目是基于 Node.js 12.x 写的，那么你可以使用 npm 模块：[`@tsconfig/node12`](https://www.npmjs.com/package/@tsconfig/node12)：
+
+```json tsconfig
+{
+  "extends": "@tsconfig/node12/tsconfig.json",
+
+  "compilerOptions": {
+    "preserveConstEnums": true
+  },
+
+  "include": ["src/**/*"],
+  "exclude": ["node_modules", "**/*.spec.ts"]
+}
+```
+
+这使你的 `tsconfig.json` 专注在你的项目的目标环境上，而不是所有可能的运行时环境。现在已经有了一些 tsconfig 基础配置，我们希望社区能够为不同的环境添加更多的内容。
+
+- [推荐配置](https://www.npmjs.com/package/@tsconfig/recommended)
+- [Node 10](https://www.npmjs.com/package/@tsconfig/node10)
+- [Node 12](https://www.npmjs.com/package/@tsconfig/node12)
+- [Node 14](https://www.npmjs.com/package/@tsconfig/node14)
+- [Deno](https://www.npmjs.com/package/@tsconfig/deno)
+- [React Native](https://www.npmjs.com/package/@tsconfig/react-native)
+- [Svelte](https://www.npmjs.com/package/@tsconfig/svelte)
+
+## 细节
+
+当没有指定 `"compilerOptions"` 时，会使用编译器的默认配置。请参考我们支持的[编译器选项](/tsconfig)列表。
+
+## TSConfig 参考
+
+想要了解更多的配置选项的信息，请访问 [TSConfig Reference](/tsconfig)。
+
+## 协议
+
+`tsconfig.json` 的协议可以在这里找到 [the JSON Schema Store](http://json.schemastore.org/tsconfig)。

docs/documentation/ko/reference/Utility Types.md

@@ -0,0 +1,95 @@
+//// { order: 3 }
+
+// 먼저 이 방식으로 이해하는 게 훨씬 쉬우므로
+// 예시는 대부분 TypeScript로 작성했습니다.
+// 마지막에는 JSDoc을 사용하여 동일한 클래스를 만드는 방법을 다룰 겁니다.
+
+// 제네릭 클래스는 특정 타입이 다른 타입에 따라 동작한다는 것을 보여주는 하나의 방식입니다.
+// 예를 들어, 여기에는 한 종류만 있지만
+// 여러 가지 물건을 담을 수 있는 하나의 서랍이 있습니다:
+
+class Drawer<ClothingType> {
+  contents: ClothingType[] = [];
+
+  add(object: ClothingType) {
+    this.contents.push(object);
+  }
+
+  remove() {
+    return this.contents.pop();
+  }
+}
+
+// Drawer를 사용하기 위해서
+// 또 다른 타입이 필요합니다:
+
+interface Sock {
+  color: string;
+}
+
+interface TShirt {
+  size: "s" | "m" | "l";
+}
+
+// 새로운 Drawer를 만들 때 Sock 타입을 전달하여
+// 양말 전용의 새로운 Drawer를 만들 수 있습니다:
+const sockDrawer = new Drawer<Sock>();
+
+// 이제 양말을 서랍에 추가하거나 삭제할 수 있습니다:
+sockDrawer.add({ color: "white" });
+const mySock = sockDrawer.remove();
+
+// 티셔츠를 위한 서랍도 만들 수 있습니다:
+const tshirtDrawer = new Drawer<TShirt>();
+tshirtDrawer.add({ size: "m" });
+
+// 여러분이 조금 별나신 편이라면,
+// 유니언을 사용하여 양말과 티셔츠가 섞인 서랍을 만들 수도 있습니다
+
+const mixedDrawer = new Drawer<Sock | TShirt>();
+
+// 추가 TypeScript 구문 없이 Drawer와 같은 클래스를 만드는 것은
+// JSDoc에서 템플릿 태그 사용을 요구합니다.
+// 이 예시에서 템플릿 변수를 정의하고,
+// 클래스에 프로퍼티를 제공할 것입니다:
+
+// playground에서 작업하기 위해서,
+// JavaScript 파일로 설정을 변경하고
+// 위에 있는 TypeScript 코드를 제거해야 합니다
+
+/**
+ * @template {{}} ClothingType
+ */
+class Dresser {
+  constructor() {
+    /** @type {ClothingType[]} */
+    this.contents = [];
+  }
+
+  /** @param {ClothingType} object */
+  add(object) {
+    this.contents.push(object);
+  }
+
+  /** @return {ClothingType} */
+  remove() {
+    return this.contents.pop();
+  }
+}
+
+// 그러고 나서 JSDoc을 통해 새로운 타입을 만듭니다:
+
+/**
+ * @typedef {Object} Coat 의류 아이템
+ * @property {string} color 코트 색상
+ */
+
+// Dresser 클래스의 새로운 인스턴스를 생성할 때
+// 코트를 다루는 Dresser로
+// 변수를 할당하기 위해 @type을 사용합니다.
+
+/** @type {Dresser<Coat>} */
+const coatDresser = new Dresser();
+
+coatDresser.add({ color: "green" });
+const coat = coatDresser.remove();

docs/documentation/zh/project-config/tsconfig.json.md

@@ -0,0 +1,118 @@
+//// { order: 4 }
+
+// TypeScript가 지원하는 JavaScript에 있는 클래스를 위해
+// 가짜 다중 상속 패턴인 믹스인이 있습니다.
+// 다중 상속 패턴은 많은 클래스가 합쳐진
+// 하나의 클래스를 생성할 수 있게 해줍니다.
+
+// 시작하기 위해, 다른 클래스로부터 확장하는 타입이 필요합니다.
+// 주요 책임은 전달받은 타입이
+// 하나의 클래스라고 선언하는 것입니다.
+
+type Constructor = new (...args: any[]) => {};
+
+// 그러고 나서 래핑하여 최종 클래스에 확장하는
+// 클래스 시리즈를 생성할 수 있습니다.
+// 비슷한 객체가 다른 능력을 갖출 때, 이 패턴은 잘 동작합니다.
+
+// 믹스인은 캡슐화된 private 프로퍼티로 변경하기 위해
+// scale 프로퍼티를 getter와 setter를 함께 추가합니다:
+
+function Scale<TBase extends Constructor>(Base: TBase) {
+  return class extends Base {
+    // 믹스인은 private/protected 프로퍼티를 선언할 수 없겠지만,
+    // ES2020 private 필드를 사용할 수 있습니다
+    _scale = 1;
+
+    setScale(scale: number) {
+      this._scale = scale;
+    }
+
+    get scale(): number {
+      return this._scale;
+    }
+  };
+}
+
+// 믹스인은 현대식 컴퓨터가 깊이를 만드는 데 사용하는
+// 알파 구성요소에 대한 추가 메서드를 추가합니다:
+
+function Alpha<TBase extends Constructor>(Base: TBase) {
+  return class extends Base {
+    alpha = 1;
+
+    setHidden() {
+      this.alpha = 0;
+    }
+
+    setVisible() {
+      this.alpha = 1;
+    }
+
+    setAlpha(alpha: number) {
+      this.alpha = alpha;
+    }
+  };
+}
+
+// 확장될 간단한 스프라이트 기반 클래스:
+
+class Sprite {
+  name = "";
+  x = 0;
+  y = 0;
+
+  constructor(name: string) {
+    this.name = name;
+  }
+}
+
+// 서로 다른 기능을 가진
+// 2개의 다른 스프라이트 타입을 만듭니다:
+
+const ModernDisplaySprite = Alpha(Scale(Sprite));
+const EightBitSprite = Scale(Sprite);
+
+// 이런 클래스의 인스턴스를 생성하는 것은
+// 믹스인 때문에 객체가 서로 다른
+// 프로퍼티와 메서드의 모음을 가진다는 것을 나타냅니다:
+
+const flappySprite = new ModernDisplaySprite("Bird");
+flappySprite.x = 10;
+flappySprite.y = 20;
+flappySprite.setVisible();
+flappySprite.setScale(0.8);
+console.log(flappySprite.scale);
+
+const gameBoySprite = new EightBitSprite("L block");
+gameBoySprite.setScale(0.3);
+
+// EightBitSprite가 알파로 변경하기 위한
+// 믹스인이 없으니 실패합니다:
+gameBoySprite.setAlpha(0.5);
+
+// 래핑한 클래스에 대해 더 많이 보장하길 원한다면,
+// 제네릭과 함께 생성자를 사용할 수 있습니다.
+
+type GConstructor<T = {}> = new (...args: any[]) => T;
+
+// 이제 이 믹스인이 기반 클래스가 특정한 형태일 때만
+// 적용할 수 있도록 선언할 수 있습니다.
+
+type Moveable = GConstructor<{ setXYAcceleration: (x: number, y: number) => void }>;
+
+// GConstructor에 대한 매개변수에 있는
+// 함수 존재 여부에 따라서 믹스인을 생성할 수 있습니다.
+
+function Jumpable<TBase extends Moveable>(Base: TBase) {
+  return class extends Base {
+    jump() {
+      // 이 믹스인은 이제 setXYAcceleration에 대하여 알고 있습니다
+      this.setXYAcceleration(0, 20);
+    }
+  };
+}
+
+// 믹스인 계층에 setXYAcceleration를 추가하는 클래스가 
+// 존재할 때까지 이 스프라이트를 생성할 수 없습니다:
+const UserSprite = new Jumpable(ModernDisplaySprite);