본문 바로가기

Web

 (17)
[TypeScript] Interfaces type Team = "red" | "blue" | "yellow"type Health = 1 | 5 | 10interface Player { nickname: string, team: Team health: Health}Interfaces는 한 가지 용도만을 가짐object 모양을 특정하기 위함 TypeScript에게 object 모양을 알려주기 위한 방법은 1. Type - 좀 더 유연함2. Interfaces - 객체 지향 프로그래밍의 개념을 활용해서 디자인 interface User { name:string}// interface는 새 타입, 필드를 정의할 떄 기존 이름 사용 가능interface User { nickname:string}interface Player e..
[TypeScript] 객체지향 - Classes * JavaScript는 제공하지 않는 기능들private, publicclass Player { constructor( private firstName:string, private lastName:string, public nickname:string ) {}}const seojin = new Seojin("seojin", "moon", "문");seojin.firstName # errorseojin.nickname abstract 클래스, abstract 메소드(클래스 안의 함수)abstract class User { constructor( constructor( private firstName:string, # priva..
[TypeScript] 다형성(Polymorphism) type SuperPrint = { (arr: number[]) : void (arr: booleanp[) : void (arr: string[]): void}const superPrint: SuperPrint = (arr) => { arr.forEach(i => console.log(i))}superPrint([1, 2, 3, 4])superPrint([true, false, false])superPrint(["a", "b", "c"])> void, boolean, unknown 이런 건 concrete type type SuperPrint = { # 타입스크립트에게 이 callsignature가 generic을 받는다는 걸 알려주는 방법 (arr: TypePla..
[TypeScript] 기본 문법 - 함수 함수를 선언하는 여러가지 방법#1 function add(a:number, b:number): number { return a+b}#2const add = (a:number, b:number) => a+b#3; call signatures, 함수의 파라미터와 리턴 타입을 명시하는 것type Add = (a:number, b:number) => number;const add:Add = (a,b) => a + b Overloading- 직접 쓸 일은 많지 않겠지만 외부 패키지나 라이브러리에서는 오버로딩을 많이 사용하기 때문에 알아둘 필요가 있음- 함수가 서로 다른 여러 개의 call signatures를 가지고 있을 때 발생type Add = { (a:number, b:number) : numbe..
[TypeScript] 기본 문법 - Type Implicit TypesJavaScript처럼 변수만 생성하고 넘어가도 타입 추론 가능let a = "hello"a = "bye"a = 1 # error Explicit Types데이터와 변수의 타입을 명시적으로 정의let : = let a = "hello"let b : boolean = "x" # error Object에 Type 선언const player : { # 타입 선언 name: string, # 반드시 필요 age?:number # ?를 붙이면 optional} = { # 실제 내용 name:"seojin"}if(player.age  > player를 여러 개 만들고 싶다면Alias 타입type Player = { name:string, age..
[TypeScript] 를 쓰는 이유 TypeScript를 사용하는 가장 큰 이유는 타입 안정성 때문=> 코드에 버그가 매우 많이 줄어듦, 런타임 에러가 줄어듦, 생산성 증가 JavaScript는 타입 안정성이 없는 언어임JavaScript는 매우 유연한 언어라, 개발자가 멍청한 코드를 짜도 이해하려고 함즉, 에러를 띄우지 않으려고 함1. [1, 2, 3, 4] + false> '1,2,3,4,false'# boolean 타입인 false가 그냥 string이 돼버림, JavaScript는 이를 허용2. function divide(a, b) { return a/b}divide("xxxx")> NaN# 코드를 실행하고 NaN를 리턴함, JavaScript는 함수를 올바르게 사용하도록 강제하지 않음3.const nico = { name:"ni..
비동기 처리, 콜백 함수(callback) 웹 개발에서는 종종 시간 지연이 일어남 서버에서 데이터를 가져온 후 화면에 표시를 해야 하는데 자바스크립트의 특성에 따라 바로 화면에 표시하는 코드를 실행하려고 함 데이터를 가져온 후 표시하는 작업을 해라 라고 지정해주는 게 비동기 처리임 예시>       시간이 얼마나 걸리든 상관없이 displayB 함수가 실행된 다음 displayC 함수가 실행됨 함수 안에 매개변수로 들어가는 함수를 콜백 함수(callback)라고 함          자바스크립트에서 비동기를 처리하는 방법1. 콜백 함수: 여러 개 반복해서 매개변수로 들어가면 복잡해질 수 있음2. 프로미스: 성공 시 실행 코드, 실패 시 실행 코드가 정해져 있음3. async/await: 실행 순서 제어
[Node.js] 란, npm, 모듈 ... - 고객(클라이언트)이 메뉴(웹 사이트)를 보고 음식(정보)을 주문하면 주방(서버)에서 음식(정보)을 만들어 고객에게 제공- Node.js는 주방에서 더 쉽고 빠르게 음식을 만들 수 있도록 도와주는 요리사 Node.js의 장점기존에 알고 있던 자바스크립트를 확장해서 백엔드 개발을 할 수 있다는 것즉, 하나의 언어로 풀스택 개발이 가능 서버를 만든다는 것서버는 클라이언트의 요청을 받아 무엇인가를 처리해서 되돌려주는 컴퓨터서버를 만든다는 건 컴퓨터를 만드는 것이 아니라 서버 컴퓨터에서 돌아가는, 실행되는 프로그램을 만드는 것필요한 서비스를 위한 프로그램을 만듦 Node.js는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임이다.=> Node.js를 사용함으로 인해 자바스크립트..

티스토리툴바