Javascript/프로그래밍 기법
-
2. 모듈패턴으로 기존 코드 개선하기 - 견고한 JS 소프트웨어 만들기 | 김정환Javascript/프로그래밍 기법 2021. 9. 2. 17:43
클릭 카운터 모듈 (ClickCounter) : 카운터 데이터를 다루는 모듈 (전역 공간에 있는 counter 변수를 ClickCounter 안에서 관리하자) 첫번째 스펙 "ClickCounter 모듈의 getValue() 는 카운터 값을 반환한다." > git checkout --force ClickCounter-spec-1 두번째 스펙 "ClickCounter 모듈의 increase() 는 카운터 값을 1만큼 증가한다." > git checkout --force ClickCounter-spec-2 beforEach는 it 함수 호출 직전에 실행되는 자스민 함수. describe(() => { beforeEach(() => {})// 1 afterEach(() => {})// 3 it(() => {})..
-
1. TDD 이론 및 패턴 소개 - 견고한 JS 소프트웨어 만들기 | 김정환Javascript/프로그래밍 기법 2021. 8. 31. 13:19
단위 테스트 (Unit Test) 단위(Unit) : 특정 조건에서 어떻게 작동해야 할지 정의한 것 (인풋에 따라 계산한 결과를 아웃풋으로 내놓는 것) ≒ 함수 - 준비, 실행, 단언(결과 검증) 패턴을 따른다. 테스트주도개발(TDD) 1. 적색(Red) 단계 기능을 테스트할 수 있는 테스트 코드를 만든다 ≒ 단위 테스트 2. 녹색(Green) 단계 함수의 기능 코드를 테스트에 통과할 수준으로 작성 3. 청색(Blue) 단계 (리팩터) 추상화, 확장 가능, 중복되지 않는 소프트웨어 공학 원칙에 준수한 코드 작성 > git clone https://github.com/jeonghwan-kim/lecture-develop-fe-with-tdd.git > git checkout -f install-jasmin..
-
Debounce & Throttle | kellis님Javascript/프로그래밍 기법 2021. 4. 1. 11:30
[출처 : kellis.tistory.com] 디바운스(Debounce)와 스로틀(Throttle)은 이벤트를 제어하는 방법으로, 과도한 이벤트의 발생이 성능 저하를 초래하지 않도록 하기 위해 사용합니다. 대표적으로 디바운스와 스로틀을 이용하여 이벤트 발생을 제어하는 기능은 아래와 같습니다. 스크롤 휠을 이용한 지도 확대/축소 검색어 입력시 자동완성 혹은 연관검색어 노출 피드 방식의 데이터 노출 (스크롤링을 통한 데이터 노출) 이벤트 오버클럭(Overclock - 과도한 이벤트 발생)은 리소스 사용량을 과도하게 증가시키기 때문에 성능 문제를 야기하고 사용자 경험을 떨어뜨립니다. 특히 스크롤 이벤트의 경우 이벤트 오버클럭을 발생시키기 쉬운데, 이는 사용자가 스크롤을 빨리 내리면 3초의 간격 내에 몇 천 번..