본문 바로가기

전체 글

 (115)
TypeScript 기본 (Literal, Union / Intersection Type) - Literal Type string, number, boolean 같은 type을 이용하여 정확한 값을 지정 가능 - 기본 예제 type Job = "developer" | "teacher" | "singer"; interface User { name : string; job : Job; } const An: User = { name : "An", job : "developer"; // Job에 선언된 것 외에 다른 것으로 선언하면 에러 } - Union Type 여러 type이 올 수 있는 경우에 사용하면 좋음 (or의 의미) - 기본 예제 interface Food { name : "food"; type : string; eat() : void; } interface Drink { name : "..
Web 성능 최적화 Web 성능 최적화는 크게 Rendering 최적화와 Loading 최적화로 나눌 수 있다. 개발자 도구(F12)에 있는 Lighthouse를 이용하여 성능 테스트를 할 수 있음 - Rendering 최적화 1. HTML 최적화 1) tag안에 직접 지정하는 Inline style을 사용하지 않는다. 불필요한 코드 중복이 발생하기 쉽고, 웹페이지가 그려지는 과정 중 Layout에 영향을 미쳐 추가 Reflow를 발생한다. 2) 복잡한 DOM Tree를 지양한다. DOM Tree가 커질수록 Rendering 속도가 느려지기 때문에 불필요한 요소는 제거한다. 2. CSS 최적화 1) Reflow, Repaint 최소한으로 줄이기 브라우저 style은 Reflow(넓이, 높이, 위치 등) 후 Repaint를 ..
TypeScript 기본 (Function) - Function 매개변수 및 return 값에 대한 type을 지정 - 기본 function 함수명(매개변수: type): return type { // 아무것도 return 하지 않으면 void } // arrow function const 함수명 = (매개변수: type) : return type => { } ex) function add(num1: number, num2: number) : number{ return num1 + num2; } - 선택적 매개 변수 (Optional) ex) function sayHello(name?: string): string { return `Hello, ${name || "world"}`; } const result = hello(); const resul..
TIL - 2022.04.11 1. TypeScript 어느 회사든 TypeScript는 필수가 되었다. 평소에 TypeScript가 부족하다고 느껴 앞으로 공부할 예정이다. 우선 기초부터 쌓고 그 이후 진행 중인 프로젝트에 적용할 생각이다. 2. 오늘 하루 느낀 점 컨디션이 별로라 일요일 하루 쉬었다. 잘 쉬지 못해서 그런지 몸 상태가 썩 좋지는 않아 집중이 잘 되지 않는다. 이제 슬슬 잠도 일찍 자고 생활 패턴을 좀 바꿔야겠다는 생각을 하였다. 나태해지지 말자
TypeScript 기본 (Type, Interface) - Type number ex) let age:number = 31; string ex) let name:string = "An"; boolean ex) let isMan:boolean = true; Array / type[] : type에는 적용할 type 입력 ex) let score:number[] = [100, 90, 80]; ex) let score:Array = [100, 90, 80]; [type, type] : Tuple로 사용, type에는 적용할 type 입력 ex) let an:[string, number]; an = ["an", 31]; // 해당 type 순서가 일치해야하며, 해당 type에 있는 메서드만 사용 가능 void : 반환하지 않는 함수에 사용 ex) function d..
TIL - 2022.04.09 1. 코딩 테스트 대부분 문자열을 다루는 문제들이 나왔다. 정규 표현식을 사용할 상황이 나올 줄 몰랐는데 결국 정규 표현식으로 구현한 문제도 있었고, 단순 문자열 + 구현 문제도 나왔다. 마지막 문제는 template 관련 문제였는데 시간이 모자라 결국 풀지 못했다. 실제 프로젝트에서 정규 표현식을 얼마나 사용할지는 모르겠지만 정규 표현식 관련 내용 중 변수를 받아서 replace를 하려고 한다면 아래와 같이 이용하면 된다. //manyCharArray에 있는 원소 값을 대소문자 관계없이 공백으로 replace for (let char of manyCharArray){ let regText = new RegExp(char, "gi"); answer = answer.replace(regText, ''); ..
TIL - 2022.04.08 1. 코딩 테스트 문제 풀기 스택, 큐, 구현 문제 위주로 풀면서 자바스크립트 문법 확인 어떻게 풀 것인가에 대한 생각을 먼저 정리하고 구현할 것 자바스크립트 문자열 처리(trim 등)에 유의하자
TIL - 2022.04.07 1. 면접 준비 면접 스터디 중 원티드 멘토님께서 인성 면접을 도와주셨다. 실제 면접에 자주 나오는 질문을 해주시고 내가 답을 하면 피드백을 해주셨다. (정말 감사합니다!) - 피드백 내용 질문에 대한 대답을 듣는데 뭔가 좀 더 이야기가 나올 것 같은데 끊어버렸다. 즉, 완결성이 부족하다. 두괄식으로 답하는 연습이 필요하다. 대답에 대한 명확한 근거를 제시해주면 좋을 것 같다. 2. 코딩 테스트 문제 풀기 완전 탐색 문제를 풀었다. 감이 좀 떨어져서 그런지 빠른 시간 내에 풀지 못했다. 코딩 테스트 문제 해결력이 곧 어떠한 기능을 구현하는 데 있어 도움이 많이 될 것이라 생각된다. 내일은 코딩 테스트 위주로 공부 예정 3. 개인 프로젝트 진행 useLocation을 이용하여 메뉴 탭 클릭 시 pathna..
반응형

티스토리툴바