TDD

→2022.05.18

[모던 자바스크립트 Deep Dive] 15장 let, const키워드와 블록 레벨 스코프

1. var 키워드로 선언한 변수의 문제점 1. 변수 중복 선언 허용 2. 함수 레벨 스코프 var 키워드로 선언한 변수는 함수의 코드 블록만을 지역 스코프로 인정한다. var x = 1; if (true) { var x = 10; // 지역 스코프로 인정되지 않은 코드 블록 내에서 변수를 재선언 하는 경우 의도치 않게 변수의 값이 변경될 수 있다. } console.log(x); // 10 함수 레벨의 스코프는 함수나 변수 선언문에서 선언한 변수도 전역 변수가 된다. 3. 변수 호이스팅 var키워드로 선언한 변수는 런타임 이전에 자바스크립트 엔진에 의해 암묵적으로 "선언 단계"와 "초기화 단계"가 한번에 진행된다. console.log(foo); // undefined var foo; console.l..

→2022.04.13

[모던 자바스크립트 Deep Dive] 14장 전역 변수의 문제점

1. 변수의 생명 주기 1. 지역변수의 생명 주기 변수는 소멸되는 생명 주기가 있다. 자신이 생성된 위치에서 생성되고 소멸한다.(Garbage Collection에 의해) 전역변수의 생명 주기는 애플리케이션의 생명 주기와 같다. 지역 변수는 함수가 호출되면 생성되고 함수가 종료하면 소멸한다. 전역변수 선언은 코드가 한 줄씩 순차적으로 런타임으로 실행되는 것이 아니라 런타임 이전 단계에서 자바스크립트 엔진에 의해 먼저 실행된다. 지역변수는 함수가 호출된 직후에 함수의 코드가 한줄 씩 순차적으로 실행되기 전에 자바스크립트 엔진에 의해 먼저 실행된다. var x = 'global'; function foo() { var x = 'local'; console.log(x); return x; } foo(); co..

→2022.04.12

[Next.js] Next.js에 대해서(React와의 차이점, Next.js+Typescript+Styled-components 초기 세팅)

1. Next.js란? Next.js는 React 라이브러리의 프레임워크 + React는 언제든지 가져와서 사용할 수 있는 라이브러리, Nextjs는 이미 정해진 규칙에 따라 코드 작성시 알아서 작성시켜주는 프레임워크 라고 생각하면 편할 듯 하다. - React의 동작방식 브라우저가 자바스크립트 코드를 가져와서 client-side의 자바스크립트가 모든 UI를 만들게 된다. (브라우저 렌더링 과정) 즉, 브라우저가 HTML을 가져올 때 비어있는 div를 가져오고 그다음 모든 JS를 요청해서 브라우저가 자바스크립트와 react.js를 실행시키고 그다음 앱이 유저에게 보여지게 된다. js를 가져와야만 화면을 띄울 수 있기 때문에 네트워크 연결이 느리거나, 파일이 큰 경우 처음에 흰 화면만 보이고 천천히 화면..

→2022.04.12

[JavaScript] 배열 메소드 map, filter 개념 및 예시

https://ordinary-code.tistory.com/8 [JavaScript] 배열 메소드 map, filter 개념 및 예시 (배열 내 특정 조건에 해당하는 데이터 가져오는 방 JavaScript의 Array 메서드 중 강력한 기능 Map, filter 활용하기 최근 프로젝트 개발 중 DBQuery를 통해 받은 결과를 재가공하는 일이 많아졌다. 해당 값에서 중복을 제거한다던지, 특정 조건을 만족하는 ordinary-code.tistory.com

→2022.03.24

[JS] Promise

Promise의 3가지 상태(states) 프로미스의 상태란 프리미스의 처리 과정을 의미한다. new Promise()로 프로미스를 생성하고 종료 될때까지 3가지 상태를 갖는다. Pending(대기) : 비동기 처리 로직이 아직 완료되지 않은 상태 Fulfiled(이행) : 비동기 처리가 완료되어 프로미스가 결과 값을 반환해준 상태 Rejected(실패) : 비동기 처리가 실패하거나 오류가 발생한 상태 https://velog.io/@gay0ung/Promise Promise 자바스크립트 비동기 처리에 사용되는 객체이다. 비동기 처리?특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성을 의미한다.주로 서버에서 받 velog.io

→2022.03.24