사용자 도구

사이트 도구


typescript:namespace

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

다음 판
이전 판
typescript:namespace [2019/07/30 08:11] – 만듦 taekgutypescript:namespace [2025/04/15 10:05] (현재) – 바깥 편집 127.0.0.1
줄 177: 줄 177:
  
 예 : 예 :
-<code html MyTestPage.html (excerpt) #+<code html MyTestPage.html (excerpt)>
     <script src="Validation.js" type="text/javascript" />     <script src="Validation.js" type="text/javascript" />
     <script src="LettersOnlyValidator.js" type="text/javascript" />     <script src="LettersOnlyValidator.js" type="text/javascript" />
줄 185: 줄 185:
  
 ===== Aliases ===== ===== Aliases =====
 +네임스페이스 작업을 단순화 할 수 있는 또 다른 방법은 ''import q = x.y.z''를 사용하여 일반적으로 사용되는 개체의 짧은 이름을 만드는 것입니다. 모듈을로드하는 데 사용되는 ''import x = require("name")'' 구문과 혼동하지 말고,이 구문은 지정된 심볼에 대한 별칭을 만듭니다. 모듈 가져 오기에서 만든 객체를 비롯하여 모든 종류의 식별자에 대해 이러한 종류의 가져 오기 (일반적으로 별칭이라고 함)를 사용할 수 있습니다.
  
 +<code javascript>
 +namespace Shapes {
 +    export namespace Polygons {
 +        export class Triangle { }
 +        export class Square { }
 +    }
 +}
 +
 +import polygons = Shapes.Polygons;
 +let sq = new polygons.Square(); // Same as 'new Shapes.Polygons.Square()'
 +</code>
 +
 +''require'' 키워드는 사용하지 않습니다. 대신 우리는 가져 오는 심볼의 정규화 된 이름에서 직접 할당합니다. 이것은 ''var''를 사용하는 것과 비슷하지만 가져온 심볼의 유형과 네임 스페이스 의미에 대해서도 작동합니다. 중요하게, 값의 경우 ''import''는 원래 기호와 별개의 참조이므로 별칭이 지정된 ''var''에 대한 변경 사항이 원래 변수에 반영되지 않습니다.
 +
 +===== Working with Other JavaScript Libraries =====
 +TypeScript로 작성되지 않은 라이브러리의 모양을 설명하려면 라이브러리가 노출하는 API를 선언해야합니다. 대부분의 JavaScript 라이브러리는 몇 개의 최상위 수준 객체 만 노출하므로 네임 스페이스는 객체를 표현할 수있는 좋은 방법입니다.
 +
 +구현을 "ambient"으로 정의하지 않는 선언을 호출합니다. 일반적으로 ''.dts'' 파일에 정의되어 있습니다. C/C++에 익숙하다면이 파일을 ''.h'' 파일로 생각할 수 있습니다. 몇 가지 예를 살펴 보겠습니다.
 +
 +==== Ambient Namespaces ====
 +인기있는 라이브러리 D3은 ''d3''이라는 전역 개체에서 해당 기능을 정의합니다. 이 라이브러리는 (모듈 로더 대신) <script> 태그를 통해 로드되기 때문에 이 선언은 네임스페이스를 사용하여 모양을 정의합니다. TypeScript 컴파일러가 이 모양을 보려면 ambient namespace 선언을 사용합니다. 예를 들어 다음과 같이 작성할 수 있습니다.
 +
 +<code javascript D3.d.ts (simplified excerpt)>
 +declare namespace D3 {
 +    export interface Selectors {
 +        select: {
 +            (selector: string): Selection;
 +            (element: EventTarget): Selection;
 +        };
 +    }
 +
 +    export interface Event {
 +        x: number;
 +        y: number;
 +    }
 +
 +    export interface Base extends Selectors {
 +        event: Event;
 +    }
 +}
 +
 +declare var d3: D3.Base;
 +</code>
typescript/namespace.1564474294.txt.gz · 마지막으로 수정됨: 2025/04/15 10:05 (바깥 편집)