✅오늘의 과제 ➰전광판 만들기 - 전광판 글씨 누르면 글자 하나씩 늘어나게 하기 ➰코드 day8.html 전광판 버튼을 클릭하세요! 전광판 버튼 day8.js let name = document.getElementById("nickName"); let mando = ["만", "만두", "만두야 ", "만두야 코", "만두야 코딩", "만두야 코딩하", "만두야 코딩하자"]; let count = 0; function buttonClicked() { name.innerHTML= mando[0]; } function nameClicked() { count++; if (count >= 7) { count %= 7; } name.innerHTML= mando[count]; } 코드 설명 전광판에 뜨는 글씨를 ..
✅함수란 ? 특정 작업을 수행하는 명령어들의 모음을 의미한다. 쉽게 말해서 코드 덩어리이다. 함수는 코드의 재사용성을 높여주기 위해 사용한다. 예를 들어 어떤 기능을 하는 100줄의 코드가 있다고 해보자. 그 코드를 함수로 만들지 않는다면 그 기능을 사용하는 부분마다 100줄의 코드를 작성해야 할 것이다. 그렇게 되면 코드의 가독성이 떨어지고 불필요한 메모리 사용량이 많아진다. 따라서 함수를 사용하는 것이다. Javascript의 함수는 다른 언어에서와는 달리 하나의 타입으로 정의되기 때문에 변수에 대입하는 것이 가능하다. ➰함수의 정의 function키워드를 붙여서 선언한다. 함수는 함수 이름, 매개변수, 실행문을 가지고 있다. 함수 선언 코드는 아래와 같이 작성한다. function 함수 이름(매개변..
✅오늘의 과제 ➰반복문과 조건문을 이용하여 간단한 스톱워치 만들기 ➰코드 day7.html 🕐 00:00:00 🕐 day7.js let times = document.getElementById("timer"); let hour = 0; let min = 0; let sec = 0; let stopWatch; function setting() { hour = parseInt(hour); min = parseInt(min); sec = parseInt(sec); sec += 1; if (sec === 60) { min += 1; sec = 0; } if (min === 60) { hour += 1; min = 0; sec = 0; } if (hour < 10 || hour === 0) { hour = "0"..
✅조건문이란 ? 주어진 조건식의 결과에 따라 별도의 명령을 수행하도록 제어하는 명령문이다. 종류에는 if-else문, switch문이 있다. ➰if-else문 if문의 이 참일 때 그 안에 있는 실행문을 실행하고 아니면 else문에 있는 실행문을 실행한다. 코드는 아래와 같이 작성한다. if (조건){ 실행문1; } else{ 실행문2; } 참이면 실행문 1, 거짓이면 실행문2를 실행하는 것이다. 다른 경우도 있다. if문의 조건이 참일 때 그 안에 있는 실행문을 실행하고 아니면 else if문에 있는 조건이 참인지 판단한다. 참이면 else if문에 있는 실행문을 실행하고 거짓이면 else문에 있는 실행문을 실행한다. 코드는 아래와 같이 작성한다. if (조건1){ 실행문1; }else if(조건2){..
✅오늘의 과제 ➰console.log()를 이용하여 사칙연산 출력하기 ➰코드 day6.html x, y + - * / % 계산식 콘솔창에 출력하기 day6.js let input; let input_x; let input_y; let clickedOperator; let dap; function operand() { input = prompt().split(','); input_x = Number(input[0]); input_y = Number(input[1]); } function operator(n) { if (n === 0) { clickedOperator = '+'; dap = input_x + input_y; } else if (n === 1) { clickedOperator = '-'; da..
✅연산자란 ? Javascript에는 5가지의 연산자가 존재한다. 산술 연산자, 대입 연산자, 증감 연산자, 비교 연산자, 논리 연산자가 해당된다. ➰산술 연산자 사칙연산을 다루는 연산자이며, 종류는 +, - , *, / , % 가 있다. 이때 / 는 몫을 계산해주는 연산자가 아니고, 소수점 자리까지 나눠주는 연산자이다. % 는 두 수를 나눈 나머지를 결괏값으로 하는 연산자이다. let n1 = 10; let n2 = 7; n1+n2; // 17 n1-n2; // 3 n1*n2; // 70 n1/n2; // 1.4285714285714286 n1%n2; // 3 ➰대입 연산자 변수에 값을 대입할 때 사용하는 연산자이다. 수학에서와 달리 프로그래밍에서 = 는 값을 대입하는 용도를 가진다. let n; n ..
이번 글의 주제는 '내가 만든 사이트 외부에서 접속 가능하게 하기'이다. 먼저 이 주제의 필요성을 알아보자. ✅ 필요성 내 노트북에서 html, css, js 코드를 구현하여 멋있는 웹사이트를 만들고 나면 주변 사람들에게 보여주고 싶기도 하고 다른 환경에서도 잘 동작하는지 확인해야 할 필요가 있다. 하지만 코드를 노트북 안에 가지고 있기만 하면 앞에서 말한 일들을 수행할 수 없다. 웹사이트는 인터넷에 공개가 되어야 의미가 있다고 할 수 있다. 따라서 내가 만든 웹사이트를 인터넷 상에 올리는 과정이 필요하다. ✅ 인터넷 상에 공개하는 방법 내 웹사이트를 인터넷 상에 올리는 방법은 두 가지가 있다. ➰ 내 컴퓨터를 서버로 만들기 내 컴퓨터 자체를 서버로 만들어서 인터넷에 내 IP주소를 알리는 방법이다. 이 ..
✅오늘의 과제 ➰console.log()를 이용하여 객체 데이터 출력하기 ➰코드 day5.html 입력한 값의 타입을 알아보자 ! day5.js function typeIs() { let s = prompt(); if (s === "true" || s === "false") { console.log("boolean"); } else if (s === "") { console.log("null"); } else if ((s.indexOf('{') != -1) && (s.indexOf('}') != -1) && (s.indexOf(':') != -1)) { console.log("object"); } else if (isNaN(s)) { console.log("string"); } else if (!isNa..
✅타입이란 ? 타입은 프로그램에서 다룰 수 있는 값의 종류를 의미한다. Javascript에서는 대표적으로 5가지 형태의 타입을 미리 정의한다. ➰숫자(Number) C++, Java와 같은 다른 프로그래밍 언어와는 다르게 정수와 실수를 따로 구분하지 않는다. let n1 = 13; let n2 = 13.1; ➰문자열(string) 큰따옴표("")나 작은따옴표('')로 둘러싸인 문자의 집합을 문자열이라고 한다. let str1 = "string1"; let str2 = 'string2'; let str3 = "'string'입니다"; let str4 = '"string"입니다'; Javascript 문자열은 숫자와 합칠 수도 있다. 코드는 다음과 같다. let n = 1; let str = "string..
✅오늘의 과제 ➰누르면 console.log()를 통해 0부터 값이 올라가는 버튼 만들기 ➰코드 day4.html 버튼을 클릭해보세요ヾ(•ω•`)o day4.js let btnClicked = 0; function numincrease() { console.log(btnClicked); btnClicked++; } numincrease(); 코드 설명 버튼을 클릭하면 btnClicked 변수의 숫자가 1씩 증가하게 했고, 버튼 클릭 횟수와 맞게 숫자가 증가하도록 하기 위해 Javascript 파일 내에서 함수를 한번 실행시켰다. ➰코드실행화면(https://jsday4.netlify.app) ➰Github https://github.com/minseon6371/javascript-study/tree/ma..
