TypeScript intro

TypeScript
https://www.typescriptlang.org/

핸드북 (캡틴판교)

• https://joshua1988.github.io/ts/intro.html

타입스크립트란?
자바스크립트에 타입을 부여. 자바스크립트를 사용할 때 발생할 수 있는 다양한 타입에 대한 에러들을 사전에 예방해준다. 코드를 직접 실행해서 에러를 확인하는 것이 아니라, 코드를 실행하기 전에 먼저 에러를 인지시켜 준다.

공식 문서 소개

//Editor Check
const user = {
  firstName: "Angela",
  lastName: "Davis",
  role: "Professor",
}
 
console.log(user.name)
Property 'name' does not exist on type '{ firstName: string; lastName: string; role: string; }'


//Auto-Completement

import express from "express"
const app = express()
 
app.get("/", function (req, res) {
  res.sen
send
sendDate
sendfile
sendFile
sendStatus
})
 
app.listen(3000)
 
//interface
interface User {
  id: number
  firstName: string
  lastName: string
  role: string
}
 
function updateUser(id: number, update: Partial<User>) {
  const user = getUser(id)
  const newUser = { ...user, ...update }
  saveUser(id, newUser)
}

//JSX
import * as React from "react";
 
interface UserThumbnailProps {
  img: string;
  alt: string;
  url: string;
}
 
export const UserThumbnail = (props: UserThumbnailProps) =>
  <a href={props.url}>
    <img src={props.img} alt={props.alt} />
  </a>