JS 튜토리얼

제이에스 홈 JS 소개 JS 어디로 JS 출력 JS 문 JS 구문 JS 코멘트 JS 변수 제이에스렛 JS 상수 JS 연산자 JS 산술 JS 할당 JS 데이터 유형 JS 함수 JS 객체 JS 이벤트 JS 문자열 JS 문자열 메서드 JS 문자열 검색 JS 문자열 템플릿 JS 번호 JS 숫자 메서드 JS 배열 JS 배열 메서드 JS 배열 정렬 JS 배열 반복 JS 배열 상수 JS 날짜 JS 날짜 형식 JS 날짜 가져오기 메서드 JS 날짜 설정 방법 JS 수학 JS 랜덤 JS 부울 JS 비교 JS 조건 JS 스위치 JS 루프 In에 대한 JS 루프 의 JS 루프 JS 루프 동안 JS 브레이크 JS 이터러블 JS 세트 JS 맵 JS 유형 JS 유형 변환 JS 비트와이즈 JS 정규 표현식 JS 오류 JS 범위 JS 호이스팅 JS 엄격 모드 JS 이 키워드 JS 화살표 함수 JS 클래스 JS JSON JS 디버깅 JS 스타일 가이드 JS 모범 사례 JS 실수 JS 성능 JS 예약어

JS 버전

JS 버전 JS 2009(ES5) JS 2015(ES6) JS 2016 JS 2017 JS 2018 JS IE / 엣지 JS 연혁

JS 객체

객체 정의 개체 속성 개체 메서드 개체 표시 개체 접근자 객체 생성자 개체 프로토타입 객체 반복 가능 객체 세트 객체 맵 개체 참조

JS 함수

기능 정의 기능 매개변수 함수 호출 함수 호출 기능 적용 함수 클로저

JS 클래스

수업 소개 클래스 상속 클래스 정적

JS 비동기

JS 콜백 JS 비동기 JS 약속 JS 비동기/대기

JS HTML DOM

DOM 소개 DOM 메서드 DOM 문서 DOM 요소 DOM HTML DOM 양식 DOM CSS DOM 애니메이션 DOM 이벤트 DOM 이벤트 리스너 DOM 탐색 DOM 노드 DOM 컬렉션 DOM 노드 목록

JS 브라우저 BOM

JS 창 JS 화면 JS 위치 JS 연혁 JS 네비게이터 JS 팝업 경고 JS 타이밍 JS 쿠키

JS 웹 API

웹 API 소개 웹 양식 API 웹 기록 API 웹 스토리지 API 웹 작업자 API 웹 가져오기 API 웹 지리적 위치 API

JS 아약스

AJAX 소개 AJAX XMLHttp AJAX 요청 AJAX 응답 AJAX XML 파일 AJAX PHP AJAX ASP AJAX 데이터베이스 AJAX 애플리케이션 AJAX 예제

JS JSON

JSON 소개 JSON 구문 JSON 대 XML JSON 데이터 유형 JSON 구문 분석 JSON 문자열화 JSON 객체 JSON 배열 JSON 서버 JSON PHP JSON HTML JSON JSONP

JS 대 jQuery

jQuery 선택기 제이쿼리 HTML 제이쿼리 CSS 제이쿼리 DOM

JS 그래픽

JS 그래픽 JS 캔버스 JS 플로틀리 JS 차트.js JS 구글 차트 JS D3.js

JS 예제

JS 예제 JS HTML DOM JS HTML 입력 JS HTML 객체 JS HTML 이벤트 JS 브라우저 JS 편집기 JS 연습 JS 퀴즈 JS 인증서

JS 참조

자바스크립트 객체 HTML DOM 객체


자바스크립트


예시

let x, y, z;    // Statement 1
x = 5;          // Statement 2
y = 6;          // Statement 3
z = x + y;      // Statement 4

자바스크립트 프로그램

컴퓨터 프로그램 은 컴퓨터 에 의해 "실행"되는 "명령"의 목록입니다.

프로그래밍 언어에서는 이러한 프로그래밍 명령어를 명령문 이라고 합니다 .

JavaScript 프로그램프로그래밍 목록입니다 .

HTML에서 JavaScript 프로그램은 웹 브라우저에서 실행됩니다.


자바스크립트 문

JavaScript 문은 다음으로 구성됩니다.

값, 연산자, 표현식, 키워드 및 주석.

이 문은 브라우저에 "Hello Dolly"를 쓰도록 지시합니다. id="demo"인 HTML 요소 내부:

예시

document.getElementById("demo").innerHTML = "Hello Dolly.";

대부분의 JavaScript 프로그램에는 많은 JavaScript 문이 포함되어 있습니다.

명령문은 작성된 순서대로 하나씩 실행됩니다.

JavaScript 프로그램(및 JavaScript 문)은 종종 JavaScript 코드라고 합니다.


세미콜론 ;

세미콜론은 JavaScript 문을 구분합니다.

각 실행 가능한 문의 끝에 세미콜론을 추가합니다.

let a, b, c;  // Declare 3 variables
a = 5;        // Assign the value 5 to a
b = 6;        // Assign the value 6 to b
c = a + b;    // Assign the sum of a and b to c

세미콜론으로 구분하면 한 줄에 여러 문이 허용됩니다.

a = 5; b = 6; c = a + b;

웹에서 세미콜론이 없는 예를 볼 수 있습니다.
세미콜론으로 끝나는 문장은 필수는 아니지만 적극 권장합니다.



자바스크립트 공백

JavaScript는 여러 공백을 무시합니다. 스크립트에 공백을 추가하여 가독성을 높일 수 있습니다.

다음 줄은 동일합니다.

let person = "Hege";
let person="Hege";

좋은 방법은 연산자( = + - * / ) 주위에 공백을 넣는 것입니다.

let x = y + z;

JavaScript 줄 길이 및 줄 바꿈

최고의 가독성을 위해 프로그래머는 종종 80자보다 긴 코드 라인을 피하고 싶어합니다.

JavaScript 문이 한 줄에 맞지 않는 경우 가장 좋은 위치는 연산자 뒤에 오는 것입니다.

예시

document.getElementById("demo").innerHTML =
"Hello Dolly!";

자바스크립트 코드 블록

JavaScript 문은 중괄호 {...} 안에 있는 코드 블록으로 그룹화할 수 있습니다.

코드 블록의 목적은 함께 실행할 명령문을 정의하는 것입니다.

블록으로 함께 그룹화된 명령문을 찾을 수 있는 곳은 JavaScript 함수입니다.

예시

function myFunction() {
  document.getElementById("demo1").innerHTML = "Hello Dolly!";
  document.getElementById("demo2").innerHTML = "How are you?";
}

이 튜토리얼에서는 코드 블록에 2개의 들여쓰기 공간을 사용합니다.
이 자습서의 뒷부분에서 함수에 대해 자세히 알아볼 것입니다.


자바스크립트 키워드

JavaScript 문은 수행할 JavaScript 작업을 식별 하는 키워드 로 시작하는 경우가 많습니다.

예약어 참조 에는 모든 JavaScript 키워드가 나열되어 있습니다.

다음은 이 튜토리얼에서 배울 몇 가지 키워드 목록입니다.

예어 설명
var 변수 선언
let 블록 변수 선언
const 블록 상수 선언
if 조건에서 실행할 명령문 블록을 표시합니다.
switch 다른 경우에 실행할 명령문 블록을 표시합니다.
for 루프에서 실행할 명령문 블록을 표시합니다.
function 함수 선언
return 기능 종료
try 명령문 블록에 대한 오류 처리를 구현합니다.

JavaScript 키워드는 예약어입니다. 예약어는 변수 이름으로 사용할 수 없습니다.