자바스크립트 기초6 '계산기 만들기' 토이 프로젝트(2) - [Javascript 입문 _14] 저번 포스팅에서 계산기를 브라우저 화면에 띄우는 것 까지 완성했습니다. 그렇지만 아직 동작하지 않기에, 우리는 자바스크립트로 계산기가 동작하게끔 구현해야겠죠? 숫자 입력 소수점 입력 사칙연산 나머지 연산 부호 반전 백분율 계산 계산 초기화 결과 계산 후 출력 총 7가지 기능을 구현해야 하네요. 하나씩 차근차근 구현해보도록 하겠습니다. 입력 현재 사용자로부터 넘어오는 입력을 다루는 함수는 calculator.js에서 handleCalculator가 담당하고 있습니다. 여기서 handleCalculator은 event를 입력으로 받는데요, 우리는 이 event가 일어난 곳이 어디인지 알아야 적절한 반응을 보여줄 수 있도록 코드를 작성할 수 있습니다. 이벤트가 일어난 곳을 알고 싶으면 event.target을.. 2020. 7. 25. '계산기 만들기' 토이 프로젝트(1) - [Javascript 입문 _14] 이번 시간에는 프로그래밍을 배우면서, 특히 자바스크립트를 배우면서 많이 시도하게 되는 계산기 프로젝트를 진행해보려고 합니다. 제가 만들고자 하는 계산기는 Mac 에서 사용되는 계산기의 디자인을 본따서 만들었습니다. 프로젝트를 진행하기 위해서는 우선 프로젝트 생성 및 파일 생성, 실행 방법을 알고 있어야 겠죠? 한 번도 프로젝트를 해보신 적이 없는 분들은 자바스크립트 입문 - 첫 번째 프로젝트 '클리커게임' 포스팅을 참고해주세요! 이번 프로젝트에서도 총 세 개의 파일이 필요합니다. 프로젝트를 생성한 다음에 index.html, calculator.css, calculator.js 이렇게 세 개의 파일을 생성해주세요. 지금은 javascript를 익히는 시간이기 때문에, 눈에 보이는 부분을 구현하지는 않겠습.. 2020. 5. 29. '숫자 야구게임 만들기' 토이 프로젝트(2) - [Javascript 입문 _8] 저번 포스팅에서 보여주는 부분은 완성했지만, 숫자 야구게임을 완성시키기는 다음과 같은 5가지 함수를 구현해야 했습니다. 제출 숫자는 4자리 체크 숫자 중복 체크 정답인지 아닌지 체크 힌트 제공 함수 정답 시도 횟수 10번 이내인지 체크 지금부터 하나씩 구현해보도록 해보죠! 4자리 체크 함수 우선은 사용자가 입력한 숫자가 4자리인지 체크하는 함수를 만들어보겠습니다. 현재 제가 숫자 야구게임 1편에서 작성한 javascript 코드에는 입력한 숫자가 String으로 넘어오게끔 되어있습니다. 만약 숫자라면 1000이상 10000미만 인지 체크하는 조건문을 사용하면 되고, 지금과 같은 상황이면 length가 4인지 체크하면 됩니다. 아래 코드처럼요! const isFourDigits = (number) => {.. 2020. 4. 12. '숫자 야구게임 만들기' 토이 프로젝트(1) - [Javascript 입문 _8] 이번 시간에는 흔히들 수업시간에 공부하기 싫어서, 지하철이나 버스타면서 친구와 장난칠 때, 군대에서 시간 보내기 용으로 많이하던 숫자 야구게임을 만들어보겠습니다. 숫자 야구 게임이 무엇인지 모르는 분들을 위해 설명하면, 문제 출제자가 4자리 수의 숫자를 생각하고 다른 한 사람이 그 숫자를 10번의 기회 안에서 맞춰야 합니다. 다만 아무런 힌트가 없다면 10번 안에 문제 출제자가 생각한 4자리 숫자를 맞추는 것이 불가능하므로, 출제자는 답을 맞추려는 시도 때마다 힌트를 넘겨주어야 합니다. 게임 이름이 숫자 야구게임인 이유는 힌트를 주는 형식 때문입니다. 정확하게 숫자와 자리수까지 일치할 경우 스트라이크(S), 숫자는 존재하는데 위치가 다를 경우 볼(B)을 넘겨줍니다. 예를 들어볼게요. 출제자: 5329 참.. 2020. 4. 12. if문 편 - Node.js로 [백준/BOJ] 단계별로 풀어보기를 풀어보다 BOJ 단계별로 풀어보기 'if문' 저번 포스팅에 이어, 이번에는 백준 단계별로 풀어보기의 두 번째인 if문 편에 대해서 작성하려고 합니다. 프로그래밍 언어를 배우고, 공부하고 익히는데는 문제를 풀어보면서 직접 코딩하는 것이 최고입니다. 책이나 유튜브 영상, 블로그 글을 보면서 예제를 따라치는 것도 좋지만 재미가 없잖아요! 직접 코딩하고 그 결과가 눈에 보이는 재미를 느끼면서 공부하는 것이 최고라고 생각합니다. 백준 사이트를 아직 모르신다면, 그리고 프로그래밍이나 코딩 공부를 접한지 얼마 되지 않으셨다면, 혹은 비전공자라면 백준 사이트에 들어가셔서 가입해보세요! 그리고 문제를 풀 때마다 마이페이지에 들어가면 푼 문제 수와 랭킹이 나오는데, 이 랭킹을 올리는 재미도 쏠쏠합니다. 그럼 if문을 풀어보도록 하.. 2020. 4. 12. 입출력과 사칙연산 편 - Node.js로 [백준/BOJ] 단계별로 풀어보기를 처음 풀어보았다. BOJ 단계별로 풀어보기 '입출력과 사칙연산' 단계별로 풀어보기는 윗 부분은 알고리즘이라고 하기에는 단순히 사용하는 언어의 문법을 아는가에 대한 문제가 많이 존재합니다. 새로운 언어로 프로그래밍을 하는 요즘, 제가 주로 사용하는 언어로 알고리즘을 풀어보고 싶다는 생각이 들어서 포스팅을 시작하려고 합니다. 1. BOJ 2557 - Hello World 이 문제는 Hello World! 를 출력하라는 문제로, 해당 언어로 문자열을 출력할 수 있느냐고 물어보는 문제입니다. 자바스크립트에서는 한 줄이면 되므로 아주 간단하게 풀었습니다. 코드 접기/펼치기 console.log('Hello World!'); 2. BOJ 10718 - We love kriii 이 문제도 마찬가지로 주어진 문장을 출력할 수 있는가에 .. 2020. 4. 11. 이전 1 다음
