JavaScript

Do it : JS -1,2.자바스크립트란, 입력과 출력, 규칙6가지

식초 2020. 9. 30. 18:21

웹 프로그래밍 이란?

-웹 브라우저와 관련된 프로그램을 작성하는 것

-자바스크립트는 웹 프로그래밍에 가장 많이 쓰인다

 

자바스크립트로 무엇을 할 수 있을까?

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