본문 바로가기

분류 전체보기203

[JS-012]키보드/마우스 이벤트 [1] 키보드 이벤트 키보드에서 특정 키를 누를 때 발생하는 것이 키보드 이벤트 입니다. 이벤트명 발생 시점 값 keydown 키가 눌렸을 때 keyCode keypress 키가 계속 눌린 상태일 때(연속 실행) ASCII keyup 키에서 손을 뗄 때 keyCode ◾ keypress 이벤트는 ASCII 표에 없는 shift, Fn, CapsLock 키는 인식하지 못함. ◾ keyCode 값 확인 사이트: https://keycode.info/ [2] 마우스 이벤트 마우스를 움직이거나 버튼 조작을 할 때 발생하는 이벤트 입니다. 이벤트명 발생 시점 click HTML 요소를 마우스로 클릭(눌렀다 떼기)때 이벤트 발생 dbclick HTML 요소를 마우스로 두 번 클릭했을 때 이벤트 발생 mousedow.. 2022. 1. 26.

[JS-011]함수 표현식(익명함수/화살표함수) [1] 함수표현식 ▶️ JS도 다른 프로그래밍 언어처럼 함수를 만든 다음에 함수 이름을 사용해서 함수를 실행하면 됩니다. ▶️ 이 외에도 JS에서는 함수를 실행하는 여러 방법이 있습니다. 이런 방법들은 "함수 표현식"이라고 말합니다. [예제1] 익명함수(Anonymous function) See the Pen 011_예제1 by wootekken (@wootekken) on CodePen. ✔️ [예제1] JS 코드 설명 ◼️ 1번~4번줄: 자바스크립트에서 함수를 만들고 사용하는 일반적인 방법 ◼️ 6~8번줄: 자바스크립트에서 익명함수를 만드는 방법. 익명이기 때문에 함수이름은 존재하지 않고 변수 f2에 함수식 자체를 넣어버리는 구조임. ◼️ 9번줄: 익명함수가 들어가 있는 변수 f2를 이용하여 함수를 .. 2022. 1. 26.

010.JS-함수(기본 사용법) [1] 함수란? 🤜 프로그래밍에서 함수는 특정 작업을 수행하는 명령어의 모임입니다. 🤜 함수는 이름을 사용하여 호출(실행)할 수 있는 재사용 가능한 코드 조각입니다. 🤜 함수는 다른 함수 내에서 함수 호출을 포함하여 프로그램의 어디에서나 호출할 수 있습니다. [2] 함수의 장점 ✅ 함수를 사용하면 동일한 코드를 여러 번 실행할 수 있습니다. ✅ 함수는 긴 프로그램을 더 작은 구성 요소로 나눕니다. ✅ 다른 프로그래머가 기능을 공유하고 사용할 수 있습니다. ✅ 함수는 프로그램에서 입력을 받아 처리를 할 수 있어서 재사용성이 높다. ✅ 함수를 많이 사용한 프로그램은 명확한 기능과 구조를 파악하기 쉽기 때문에 테스트와 디버깅을 더 쉽게 할 수 있게 해준다. [예제1] 자바스크립트 함수 1 See the Pen.. 2022. 1. 25.

[아두이노중급.002]터치스크린으로 아두이노 LED/센서 제어하기 [아두이노중급.002]터치스크린으로 아두이노 LED/센서 제어하기 Nextion 터치스크린의 소프트웨어를 설치했다면, 이제 터치스크린과 아두이노를 연결합니다. 그리고 터치스크린 소프트웨어에서 간단한 버튼 UI를 만든 뒤 아두이노의 LED를 ON, OFF 하는 동작/ 센서값을 확인하는 프로그램을 만들어 보도록 하겠습니다. [1] Nextion 터치스크린에 전원 연결하기 (1) 이 예제에서 사용한 Nextion 터치스크린 모델은 아래와 같습니다. 모델명: NX4832T035(구매링크 클릭) Nextion HMI LCD, 감압식 터치, 3.5인치 NX4832T035 , 기본형 : 터치스크린 > 디스플레이 LED/LCD 스마트 디스플레이, 터치디스플레이, 터치lcd, 480x320, 라즈베리 파이A+, B+ 그.. 2022. 1. 21.

[아두이노중급.001]Nextion 터치스크린 - 소프트웨어 설치 일상생활에서 우리가 사용하는 입력장치들의 종류는 아주 많습니다. 그 중에서 버튼 입력이 가장 많을 텐데요. 버튼을 사람의 손가락 터치로 입력이 가능하게 하는 "터치스크린"이 요즘은 유행입니다. 그래서 기존의 버튼식 입력장치들이 터치스크린으로 많이 대체되고 있습니다. 버튼은 아무래도 많이 누르면 고장날 수도 있고 외부에 튀어나와 있다보니 충격을 받아 떨어질 수도 있고요. 또한 원하는 개수만큼 버튼을 달려면 돈이 들고, 공간이 협소할 경우 버튼 달기가 쉽지 않습니다. 하지만 터치스크린은 쉽고 간편하게 버튼을 만들 수 있고, 외관상으로 볼 때도 깔끔하고 사용하기 편리합니다. 이런 터치스크린을 아두이노에도 연결하여 사용할 수 있는데요. 이 때 가장 많이 사용하는 것이 Nextion 회사의 TFT 터치스크린 입니.. 2022. 1. 21.

009.자바스크립트 응용문제(짝수홀수/배수찾기) [문제1] 사용자로부터 입력받은 수가 짝수인지 홀수인지 판단해 주는 프로그램을 만드세요. 아래 그림과 같이 출력되도록 하세요. *정답보기(더보기 누르기) 더보기 See the Pen JS_009_응용문제_정답 by wootekken (@wootekken) on CodePen. [문제2] 사용자로부터 자연수 1개(1~100 사이의 값)를 입력받습니다. 1~100 까지 숫자 중에서 사용자가 입력한 숫자의 배수를 모두 표시하고, 그 배수가 총 몇개인지 출력하는 프로그램을 만드세요. 아래 그림과 같이 출력되도록 하세요. *정답보기(더보기 누르기) 더보기 See the Pen JS_009_ by wootekken (@wootekken) on CodePen. 2022. 1. 20.

008.JS_반복을 멈추거나 건너뛰기(break,continue) 반복문을 멈출 때는 break를 사용합니다. 현재 실행되고 있는 반복문을 건너뛰고 반복문의 시작지점으로 다시 돌아가려면 continue를 사용합니다. [예제1] break문으로 반복문 멈추기 See the Pen JS_008_예제1 by wootekken (@wootekken) on CodePen. [예제2] continue문으로 반복문 시작점으로 되돌리기 See the Pen Untitled by wootekken (@wootekken) on CodePen. 위 for문에서 continue가 실행되면, 아래쪽의 코드를 무시하고 for문의 i++로 가서 실행됩니다. i++로 점프하여 실행된 뒤, i < 10를 체크하여 참이면 for반복문을 계속하고, 거짓이면 반복문을 벗어납니다. [퀴즈1] 다음의 조건을.. 2022. 1. 19.

007.자바스크립트 반복문(for,while) [1] for문 예제1 See the Pen JS_007__예제1 by wootekken (@wootekken) on CodePen. 위 코드는 전형적인 for문의 예시 입니다. for(변수 시작값; 변수 비교값; 변수 증감값) 을 이용해서 변수 비교값의 결과가 참(True)이면 for 반복문을 계속 실행하고, 거짓(False)이면 for 반복문을 멈추고 다음으로 넘어갑니다. 아래 그림에 for 문의 실행 순서에 대해 번호가 매겨져 있습니다. (1)~(4)번 순서대로 실행됩니다. (1)은 반복을 시작할 때 보통 만들게 되는 변수의 시작값 입니다. (2) 부분은 참과 거짓을 나타내는 코드입니다. 이 부분이 참일 경우 (3)번을 실행하게 되고, 거짓일 경우 for 반복문을 벗어나( 물결괄호{ }를 벗어나 ).. 2022. 1. 19.

006.자바스크립트 조건문(if, switch) [예제1] if문으로 0보다 큰지 검사하기 if(참/거짓)문은 (괄호) 속에 오는 상태값이 참이면 명령어를 실행하고, 그렇지 않으면 실행하지 않습니다. if(참/거짓)문의 (괄호) 속의 상태값이 거짓이면 else 부분을 실행하게 됩니다. 즉, if~else 구문은 두 개중 하나를 선택해서 실행할 때 사용하는 명령어 입니다. See the Pen JS_006__예제1 by wootekken (@wootekken) on CodePen. [퀴즈1] 다음의 조건을 만족하는 프로그램을 만드세요. 사용자로부터 prompt입력을 받아 age변수에 저장합니다. 변수 age값이 18보다 크거나 같으면 "성인입니다"라고 화면에 출력하고, 그렇지 않으면 "미성년자입니다"라고 화면에 출력되게 하세요. *퀴즈정답(더보기 누르기.. 2022. 1. 19.

이전 1 ··· 16 17 18 19 20 21 22 23 다음

728x90

티스토리툴바