본문 바로가기

전체 글

 (53)
[TS] 타입스크립트 쓰는 이유 JS와 TS의 차이점 JS : 동적 타입 언어, 인터프리터 언어 TS : 정적 타입 언어, 컴파일 언어 JS는 변수마다 타입을 지정해주지 않아도 유연하게 동적으로 잘 작동하는 장점을 가지고 있다. 간단한 구조의 프로젝트를 할때에는 위 내용이 장점이라고 생각했지만 복잡한 프로젝트를 진행하니 수많은 컴포넌트, props, 변수들을 사용하며 단점이 될 수도 있겠다는 생각이 듦. 타입을 명시하는 TS를 사용함으로써 버그 발견에 용이하도록 하고, 코드 가독성을 높이고, 현재 진행중인 프로젝트의 특성인 재사용성을 높이고자 했음. TS를 학습하며 느낀 장점 1. 버그를 쉽게 찾아낼 수 있음. 타입이 지정되지 않은 변수를 참조하고자 할 때(name만 저장되어 있는 info에서 age를 참조한다고 할 때) JS는 지정되..
[JS] 비동기 프로그래밍 #2 Promise Promise는 비동기 처리에 사용되는 자바스크립트 객체이다. 비동기 작업의 성공과 실패를 나타내준다. 비동기작업이 성공한다면? Promise의 결과물 안에 결과값이 들어가게 된다. 실패단다면? Promise의 결과물 안에 작업중 발생한 에러가 들어가게 된다. promise = {state: 상태 Result: 결과물} 1. Promise 객체 생성 Promise의 state 종류 3가지 1. Pending 대기 - result: undefined 2. Fulfilled 성공 - result: 결과값 3. Rejected 실패 - result: 에러 아래 코드처럼 Promise 생성 시 생성자 안에 resolve와 reject라는 매개변수를 가진 콜백함수(=executor)를 넣게 된다. const pr..
[프론트] 모바일 Input 클릭 시 확대현상 해결 1. 폰트의 크기를 16px로 맞춰주기 미디어 쿼리를 이용해 모바일 환경에서는 폰트의 크기가 16px이 되도록 맞추어준다. 2. index.html에서 meta태그의 viewport에 content를 추가한다. user-scalable = no 라는 속성을 통해 확대 현상을 해결할 수 있다. maximun-scale은 최대 배율 범위를 의미한다.
[JS] 비동기 프로그래밍 #1 비동기처리와 동기처리, 콜백 Node.js를 이용해 백엔드를 공부하기 전에 비동기처리와 동기처리의 개념을 잡고자 한다. 동기(synchronous ) - 코드가 위에서 아래로 순차적으로 실행된다. - 하나의 작업이 끝날 때까지 기다렸다가 다음 작업을 실행한다. JS코드를 실행하면 동기처리를 하더라도 함수나 변수 선언과 같은 경우에는 순서가 바뀌는 것처럼 보이는 경우가 있는데 이는 호이스팅이라는 것 때문이다. *호이스팅 : 브라우저에서 자바스크립트 코드를 실행시키기 전 함수나 변수같은 선언문을 가장 위로 올리는 작업 그렇다면 비동기처리는 왜 필요한 것일까? 오래걸리는 작업을 동기처리한다면?? Blocking 발생 -> 하나의 작업이 끝나야지만 다음 작업을 시작하므로 오래 걸리는 작업을 실행 시 나머지 작업의 대기시간이 길어짐. 비동기..
[JS] Array 함수 (forEach, map, filter, reduce) 기본적으로 이 함수들은 자신의 매개변수에 함수(콜백함수)를 전달받는 함수이다. 이러한 함수들을 고차함수라고 부른다 1. forEach(함수, this 값) forEach는 for 반복문 대신에 사용한다. 즉, 배열의 모든 요소를 참조한다. a.forEach(function(v,i){ console.log(v,i,this); },[1,2]); 이와 같이 사용하며 v는 호출한 요소, i는 호출한 요소의 인덱스, this는 forEach의 두번째 매개변수의 값을 출력하게 된다. 2. map(함수, this 값) 요소를 하나하나 순환하며 새로운 배열을 생성하여 리턴한다. * 새로 만들어지더라도 길이는 원본 배열과 같으며 return되지 않으면 undefined값이 들어가게 된다. a = [10,11,12,13,..

티스토리툴바