웹 프로그래밍 이란?
-웹 브라우저와 관련된 프로그램을 작성하는 것
-자바스크립트는 웹 프로그래밍에 가장 많이 쓰인다
자바스크립트로 무엇을 할 수 있을까?
1. 웹 사이트 동적으로 만든다 (ex. 화살표 버튼)
2. 웹 브라우저 프로그램 만든다 (ex. 버스정류장 어플리케이션, 그림판)
3. 서버용 프로그램 만든다 (ex. node.js)
자바스크립트의 특징은?
-모든 웹 브라우저에서 작동한다 (ES5 문법 주로 사용)
-별도의 프로그램 설치X
-다양한 용도의 프로그램 개발 (ex. 어플, 아두이노, 드론, IoT)
-공개 API 사용 가능 | API = 데이터를 다른 사람이 손쉽게 가져갈 수 있도록 미리 준비한 체계
-다양한 라이브러리(ex. jQuery), 프레임워크 (ex. 앵귤러, 뷰)
자바스크립트 소스 작성 & 실행
HTML 문서 안에 자바스크립트 소스 작성
-문서 어디에서든 사용 가능 (보통 </body> 앞에 쓴다)
-여러개 사용 가능
-삽입된 위치에서 소스 실행됨
<script>JS내용</script>
외부 스크립트 파일 연결
<script src=이름.js></script>
자바스크립트 입력과 출력
크롬 콘솔 창
-자바스크립트 소스를 간편하게 연습 가능
ctrl+shift+J
prompt() 함수 - 사용자에게 입력값 받기
prompt(); 프롬프트 창 나타난다 > 내용 입력 가능
prompt("이름을 입력하세요."); 입력한 내용이 함께 표시된다
alert() 함수 - 알림 창으로 출력하기
alert("환영합니다"); 입력한 내용이 알림 창에 표시된다
document.write() 함수 - 웹 브라우저 화면에 출력하기
결과값을 브라우저에 출력하는 용도이다
var name=prompt("이름: ");
document.write(name + "님, 어서오세요!"); > 식초라고 쓰면 > 식초님, 어서오세요! 라고 출려됨
console.log() 함수 - 콘솔에 출력하기
사용 방법은 document.wirte()와 같다
var name=prompt("이름: ");
console.log(name + "님, 어서오세요!");
크롬 콘솔로 오류 찾아내기
1. 콘솔창 열기
2. 빨강색 글자로 오류 내용, 개수 표시됨 | 파일이름, 줄번호 표시됨 > 클릭
3. 노란색으로 표시된 오류 > 비쥬얼 스튜디오에서 고치기
자바스크립트 규칙 6가지
규칙1. 대소문자 구별한다
규칙2. 들여 쓰는 습관
규칙3. 세미콜론(;)을 문장 끝에 붙인다
규칙4. 메모를 하려면 주석을 단다
//한 줄 주석
/*
여러 줄
주석
*/
규칙5. 식별자는 규칙을 지킨다
(식별자: 변수, 함수, 속성 등을 구별하기 위해 개발자가 이름 붙인 단어)
var name = promt("이름을 입력하세요.");
원하는 대로 작성한다
첫번째 글자는 문자, 밑줄(_), 달러($)로 시작한다
규칙6. 예악어는 식별자로 사용 못한다
argument | breake | case | continue | default |
do | else | false | for | function |
if | null | return | super | switch |
this | true | try | typeof | var |
void | while | with |
'JavaScript' 카테고리의 다른 글
Do it : JS -4. 제어문 : if문 | if..else문 | switch문 | for문 | while문 | do..while문 | break문 | continue문 (0) | 2020.10.03 |
---|---|
Do it : JS -3.변수, 자료형, 연산자 (0) | 2020.10.01 |
드림코딩 : JS -2. 콘솔 출력, JS 공식사이트, async VS. defer (by.자바스크립트 기초강의, ES5+) (0) | 2020.09.29 |
생활코딩 : JS 정리 -5. 낮/밤 버튼 (by 웹 어플리케이션 만들기) (0) | 2020.08.29 |
생활코딩 : JS 정리 -4. 이벤트 태그 (by 웹 어플리케이션 만들기) (0) | 2020.08.29 |