TypeScriptとは?
9733 ワード
TypeScript
JavaScriptベースの言語では、JavaScriptはクライアントスクリプト言語であり、Type Scriptはオブジェクト向けのコンパイル言語である.
JavaScriptのすべての機能があります.
Types
JavaScriptのダイナミックタイプによる問題を解決します.タイプは次のように設定できます.
JavaScriptとType Scriptコードの例
JavaScript
function add(a, b) {
return a + b;
}function add(a: number, b: number) {
return a + b;
}TypeScript in React
IndexPage変数のタイプ設定:反応器が提供する関数型素子タイプ
import React, { FunctionComponent } from 'react'
import Text from 'components/Text'
const IndexPage: FunctionComponent = function () {
return <Text text="Home" />
}
export default IndexPageGeneric
クラスまたは関数で使用するタイプがXであることを事前に決定し、その関数を使用するときに決定します.
// Generic 사용 안 한 경우 스택에 숫자 5들어있는 상태에서 모르고 문자 'a' 넣으려고 하면 문제 발생.
class Stack {
private data: any[] = []
constructor() {}
push(item: any): void {
this.data.push(item)
}
pop(): any {
return this.data.pop()
}
}
// DataType: Generic 사용하여 Stack 만듦
class Stack<DataType> {
private data: DataType[] = []
constructor() {}
push(item: DataType): void {
this.data.push(item)
}
pop(): DataType {
return this.data.pop()
}
}
// Generic 사용시에 다음과 같이 원하는 타입 지정
const stack = new Stack<number>()
// 이제 스택에 숫자만 넣을 수 있음
import React, { FunctionComponent } from 'react'
type TextProps = {
text: string
}
const Text: FunctionComponent<TextProps> = function ({ text }) {
return <div>{text}</div>
}
export default Texthttps://www.inflearn.com/course/gatsby-%EA%B8%B0%EC%88%A0%EB%B8%94%EB%A1%9C%EA%B7%B8/lecture/76337?tab=note&mm=close
https://velog.io/@pluviabc1/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%EC%99%80-%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%B0%A8%EC%9D%B4%EC%A0%90
Reference
この問題について(TypeScriptとは?), 我々は、より多くの情報をここで見つけました https://velog.io/@hssarah/TypeScript란テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol