차이

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

--- typescript:deep:type [2019/11/18 14:57] – [Solution 1 - any] taekgu
+++ typescript:deep:type [2025/04/15 10:05] (현재) – 바깥 편집 127.0.0.1
@@ 줄 10: / 줄 10: @@
 ==== Solution 1 - any ====
-<code javascript>
+OK, this is the most ugly way to achieve it, you can simply declare a variable as ''any'' type, then later, you can assign a function to it. It's not recommend.
+좋아, 이것은 가장 못난 접근 방법이다, 당신은 ''any''타입의 변수를 단순히 선언하고 그것에 함수를 할당한다. 이것을 추천하지 않는다.
+<Code:typescript>
 let a: any;
@@ 줄 16: / 줄 20: @@
     console.log('It works');
 }
-</code>
+</Code>
+==== Solution 2 - Function ====
+Sometimes, when you design the interfaces, you have no idea what the actual signature will be, but instead declaring a 'any' type, you can use a keyword 'Function', so you can take advantage of the type checking later.
+때로는 인터페이스를 디자인 할 때 실제 서명이 무엇인지 모르지만 'any'유형을 선언하는 대신 키워드 'Function'를 사용하여 나중에 유형 확인을 활용할 수 있습니다.
+<Code:typescript>
+let a: Function;
+a = function(): void {
+    console.log('It works');
+    }
+</Code>
+OK. So now when you want assign a value other than function to this variable 'a', the compiler will throw an error :
+좋아. 이제 변수 'a'에 함수가 아닌 다른 값을 대입할때 컴파일러는 에러를 발생시킨다.
+> Type 'xxxxx' is not assignable to type 'Function'
+==== Solution 3 - More specific signature: ====
+Now, as your projets goes on, you have whole idea of what's going on there. So you can go back and modify your declaration to a more precise version using the fancy arrow function syntax, feel free to use it, it maked as 'standard' in ECMA2015.
+이제, 당신의 프로젝트가 진행됨에 따라, 당신은 거기에 대한 전체를 알고 있다. 그래서 당신은 뒤로 돌아가 당신의 선언를 연습버젼에서 화려한 화살표 함수문법으로 수정할 수 있다. 화살표함수는 ECMA2015에서 표준이 되었다.
+<Code:typescript>
+let a: (para: string) => string;
+a = function(pass: string): string {
+    return pass;
+  }
+</Code>
+The syntax here is very simple, it is just like the lambda function in Java or C#, the 'string' after the arrow is the type of the return value. The para: string defines the type of the parameter. It takes a ''string'' and return a ''string''.
+여기 문법은 매우 단순하고, 이것은 자바와 씨샵의 라므다 함수와 유사하게 화살표후의 'string'은 반환값의 타입이다. 'para: string'은 파라메터의 타입을 선어한다. 이것은 ''문자열''을 받아서 ''문자열''을 반환한다.
+==== Solution 4 - Use type ====
+We can use ''type'' to declare a function type:
+''type''을 이용하여 함수 타입을 선언할 수 있다.
+<Code:typescript>
+type read = (name: string) => void;
+const test: read = (value: string) => {
+  console.log(value);
+}
+</Code>
+==== Solution 5 - Interface them all ====
+We are Typescript, we'd love to use the beloved ''interface'' for everything, well, you can, for just a function.
+우리는 타입스크립트에서는, 우리는 모든 것에 대해서 사랑하는 ''interface''를 사용를 선호한다. 글쎄, 당신은 함수에 대해서도 할 수 있다.
+<Code:typescript>
+interface read {
+  (name: string): string;
+}
+const test: read = (value: string) => value;
+</Code>
+==== Summary ====
+In pratice, I often use ''Solution 4 - Type''. Maybe just because it looks simpler than ''interface'' version.
+경험적으로 나는 4번 Type을 선호한다. 아마도 ''interface''버전보다 단순해 보이기 때문이다.

GaramX

사용자 도구

사이트 도구

차이

문서 도구