지난 시간에 이어 오늘은 자바스크립트로 계산기 기능을 구현하는 실습을 진행했다. 엣지 케이스(Edge case)와의 전쟁 계산기를 사용할 때 사용자들이 1 + 1 = 2 처럼 정직한 계산만 시행하면 좋겠지만 실생활에서는 수많은 방식의 예외적인 사용법들이 실행된다. 예컨대 한번만 입력해야 하는 소수점을 여러 번 누를 수도 있고 더했다 뺐다 나눴다 하는 연속적인 연산을 여러 번 해야 할 수도 있으며 10+0.1을 하고 싶을 때 +를 누른 다음 바로 소수점을 눌러서 0.1을 만들고 싶을 수도 있다. 이처럼 일반적인 시나리오와는 다른 예외적인 상황을 엣지 케이스라고 부른다. 계산기는 정확한 결과값을 내는 것이 기능의 전부라고 할 수 있는 만큼 엣지 케이스를 철저하게 처리하는 것이 중요하다. 특히나 어려웠던 엣지..
1. 조건문 1-1. if ... else문 1-2. switch문 2. 반복문 2-1. for문 2-2. while문 3. 함수 3-1. 함수 정의 3-2. 함수 호출 1. 조건문 조건문은 주어진 조건식이 참인지 거짓인지에 따라 실행할 코드 블록을 지정하는 것이다. 자바스크립트의 조건문으로는 if ... else문과 switch문이 있다. 1-1. if ... else문 if(조건식) { // 조건식이 참일 때 실행할 코드 블록 } else { // 조건식이 거짓일 때 실행할 코드 블록 } if ... else문에 조건을 추가하기 위해서는 else if를 사용한다. if(조건식) { // 조건식1이 참일 때 실행할 코드 블록 } else if{ //조건식2가 참일 때 실행할 코드 블록 } else { ..
1. 데이터 타입 1-1. 숫자(number) 타입 1-2. 문자열(string) 타입 1-3. 불리언(Boolean) 타입 1-4. 기타 2. 변수 2-1. 변수 선언과 할당 2-2. 변수 호이스팅 1. 데이터 타입 자바스크립트의 모든 값은 데이터 타입을 갖는다. 자바스크립트에는 7개의 데이터 타입이 있다. 7개의 데이터 타입은 원시 타입(primitive type)과 객체 타입(object type)으로 분류할 수 있다. 이중 원시 타입에는 숫자, 문자열, 불리언, undefined, null, 심벌 타입이 있다. 1-1. 숫자(number) 타입 자바스크립트의 숫자는 모두 실수로 처리된다. 숫자 타입에는 세 가지 특별한 값이 포함된다. Infinity: 양의 무한대 -Infinity: 음의 무한대 ..
html, CSS, Javascript 기초를 공부한 기념으로 Frontend Mentor의 'Interacitve card details form' 챌린지에 도전했다. 결론부터 말하자면 다른 기능은 대체로 어찌저찌 구현했으나 form validation 기능을 제대로 구현하지 못한 채로 일단 1차로 마무리를 했다. 다른 사람들의 솔루션을 보니 리액트를 대다수가 활용한 것 같아 리액트 공부를 먼저 하고 다시 도전해 보기로. 만들어야 하는 것은 아래와 같다. 내 결과물 User card details jeannelee57.github.io 어려웠던 것들 정리 1. 카드번호에 띄어쓰기 구현 change eventListner를 넣고 띄어쓰기를 삽입하도록 했는데 이렇게 하면 내용을 입력하다가 중단하더라도 띄어..
피보나치 수열 첫 항과 둘째 항은 1, 그 뒤로는 앞의 두 항을 더해서 만들어지는 수열. (1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, ...) 여기서는 첫 항이 0, 둘째 항이 1, 그 뒤로는 앞의 두 항을 더하는 수열을 만든다. function fibonacciGenerator (n); 을 만들어서 n값에 수열의 항 개수를 넣으면 그만큼의 피보나치 수열을 만들어 준다. 나의 피보나치 수열 솔루션 1 2 3 4 5 6 7 8 9 10 11 function fibonacciGenerator (n) { var output = []; for (var i = 0; i