🧊

Typescriptとは

2023/11/01に公開

Typescriptとは?

JavaScriptにtypeを与えた言語です。JavaScriptと違ってファイルを一回変換しないとダメです(complie)

complieするためはターミナルでtypescriptをnpmした後tscをするとindex.jsに変換してくれます。

npm i typescript -g 
tsc index.ts

なぜTypescript?

⚫️エラーの事前防止になります
⚫️コードガイドと自動完成(開発生産性の向上)です

function sum(a, b) {
  return a + b;
}

上記のコードでtypeを指定しないまま使うとエラーが発生します。
sum(2, "10")の場合numberではないためsrtingをプラスするので"210"がでます。

function add(a: number, b: number) {
  return a + b;
}

var result = add(10, "20");

aとbにタイプを指定するとstringでエラーを表示してくれます。
またresultがnumberのことを知ってnumberで使えるAPIを見せてくれます。

tsではなくjsでtypeを指定したい場合は以下のように書きます。

/**
 *
 * @param {number} a
 * @param {number} b
 * @returns
 */

function sum(a, b) {
  return a + b;
}

sum(2, 5);
sum(2, "10");

でもsum(2, "10");の"10"部分ではエラーの表示が出ないので// @ts-checkを書くとsum(2, "10")にエラーを表示してくれます。

変数タイプ

// js
const srt = "hello"

// ts
const srt: string = "hello" // 문자열
const num: number = 10 //숫자열
const arr: Array<number> = [1,2,3] // 배열

タプル (tuple)

const address : [stging, number] = ["banana",10]

object

const obj: object = {}
const person: object = {
   name:"park",
   age:100
}

const person1: {name: string, age: name } = {
   name:"park",
   age:100
}

boolean

const show: boolean = true

function

function sum(a: number, b: number):number {
    return a + b
 }
 sum(10, 20)
 
 // 함수의 옵셔널 파라미터
function log(a: string, b?: string):number {
    
 }
 log("hello")
 log("hello", "sunny")

Discussion