IIFE IIFE는 '즉시 실행 함수 표현식'으로, Immediately Invoked Function Expression의 약자이다. 정의를 함과 동시에 바로 실행이 되는 함수를 말한다. 어떻게 사용하나요? 우리가 사용하는 함수 표현식은 아래와 같다. function add(a, b) { return a + b; } add(1, 5); 함수를 정의하고, 이후에 호출을 해야 함수가 실행된다. 호출을 하지 않고 함수를 바로 실행할 수 있는 방법이 바로 IIFE이다. 위의 add 함수를 아래와 같이 바꾸면 된다. (function add(a, b) { return a + b; })(); 아주 간단! 아래와 같이 화살표 함수로도 작성이 가능하다. (() => { ... }(); 익명 함수로 작성하는 것이 일반..
querySelectordocument.querySelector(selectors);document.querySelector는 'selectors'와 일치하는 문서 내의 첫 번째 element를 반환한다. 일치하는 요소가 없다면 null 반환. getElementByIddocument.getElementById(id);document.getElementById는 주어진 문자열과 일치하는 id 속성을 가진 요소를 찾아 이를 나타내는 element 객체를 반환한다. 일치하는 요소가 없다면 null 반환.id가 없는 요소에 접근하려면 querySelector를 사용한다. 차이점querySelector보다 getElementById가 더 빠르다.querySelector는 다양한 선택자를 사용할 수 있다. (ge..
잘 실행되던 파일이 갑자기 난생 처음보는 오류를 뱉어냈다. 구글링 해보니 인터넷 연결 확인 크롬 재실행 개발자 도구에 Disable cache를 No throttling으로 설정 이렇게 세가지 방법이 있었는데 인터넷 연결 양호, 크롬 재실행 해도 안되고, 개발자 도구에는 이미 No throttling으로 되어있었다. VScode도 껐다 켜기를 반복했는데 안됐다.. 해결 방법 launch.json파일이 있다. 저거 클릭하면 나옵니당! 내부 코드를 아래와 같이 수정해주면 된다! "configurations": [ { "type": "chrome", "request": "launch", "name": "Launch Chrome against localhost", //"url": "http://localhos..
[Study] TDD란 무엇일까? [Study] TDD란 무엇일까? TDD란? TDD는 Test-Driven Development의 약자로, 테스트 주도 개발이라 한다. 개발을 한 후에 테스트하는 방식이 아닌, 테스트를 한 후에 개발하는 방식을 말한다. 설계 -> 코드 개발 및 테스트 케이스 작 rinn-story.tistory.com TDD에 대해 알아보았으니, 이제 Jest를 사용해보자. Jest? 테스트 코드가 중요하다는 것은 이전 글에서 확인했으니 이제 JavaScript 테스트 프레임워크 중 하나인 Jest로 테스트를 진행해보려 한다. Jest는 React 이외에 typeScript, Angular, Vue, Node 등도 테스트가 가능하다. Zero config 테스트 전 설정할 것이 많은 다..
Homebrew로 node, npm 다운받기 brew install node Homebrew로 yarn 다운받기 brew install yarn --ignore-dependencies node를 이미 다운 받았으면 --ignore-dependencies로 node를 제외하고 yarn을 다운 받는다. 각각 -v로 버전이 확인되면 잘 다운 된 것이다. create-react-app 만들기 typescript 프로젝트를 만들거라, 뒤에 --template typescript를 붙여줬다. # create react-app use npm npx create-react-app my-app --template typescript # create react-app use yarn yarn create react-app..
백준 2309 일곱 난쟁이 문제 왕비를 피해 일곱 난쟁이들과 함께 평화롭게 생활하고 있던 백설공주에게 위기가 찾아왔다. 일과를 마치고 돌아온 난쟁이가 일곱 명이 아닌 아홉 명이었던 것이다. 아홉 명의 난쟁이는 모두 자신이 "백설 공주와 일곱 난쟁이"의 주인공이라고 주장했다. 뛰어난 수학적 직관력을 가지고 있던 백설공주는, 다행스럽게도 일곱 난쟁이의 키의 합이 100이 됨을 기억해 냈다. 아홉 난쟁이의 키가 주어졌을 때, 백설공주를 도와 일곱 난쟁이를 찾는 프로그램을 작성하시오. 입력 아홉 개의 줄에 걸쳐 난쟁이들의 키가 주어진다. 주어지는 키는 100을 넘지 않는 자연수이며, 아홉 난쟁이의 키는 모두 다르며, 가능한 정답이 여러 가지인 경우에는 아무거나 출력한다. 브루트포스의 기본적인 문제라 보면 되겠다..
백준 25206 너의 평점은 https://www.acmicpc.net/problem/25206 25206번: 너의 평점은 인하대학교 컴퓨터공학과를 졸업하기 위해서는, 전공평점이 3.3 이상이거나 졸업고사를 통과해야 한다. 그런데 아뿔싸, 치훈이는 깜빡하고 졸업고사를 응시하지 않았다는 사실을 깨달았다! 치 www.acmicpc.net 문제 인하대학교 컴퓨터공학과를 졸업하기 위해서는, 전공평점이 3.3 이상이거나 졸업고사를 통과해야 한다. 그런데 아뿔싸, 치훈이는 깜빡하고 졸업고사를 응시하지 않았다는 사실을 깨달았다! 치훈이의 전공평점을 계산해주는 프로그램을 작성해보자. 전공평점은 전공과목별 (학점 × 과목평점)의 합을 학점의 총합으로 나눈 값이다. 인하대학교 컴퓨터공학과의 등급에 따른 과목평점은 다음 표..
TDD란? TDD는 Test-Driven Development의 약자로, 테스트 주도 개발이라 한다. 개발을 한 후에 테스트하는 방식이 아닌, 테스트를 한 후에 개발하는 방식을 말한다. 설계 -> 코드 개발 및 테스트 케이스 작성 (X) 테스트 케이스 작성 -> 코드 개발 및 리팩토링 (O) TDD를 해야하는 이유 코드를 수정 또는 기능을 추가할 때 빠르게 검증할 수 있다. 코드를 깔끔하게 작성할 수 있다. 개발이 끝나면 우리는 테스트 코드를 작성하는 데 시간을 들이고싶지 않다. TDD를 한다는 것은 곧, 테스트 코드를 먼저 작성해야 한다는 것이다. 우리가 늘 하던 코드 개발 후에 테스트 코드를 작성하는 것보다 테스트 코드를 먼저 작성하는 이유가 TDD를 해야하는 이유와 동일하다. 테스트 코드를 작성하면..
