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 객체


자바스크립트 구문

JavaScript 구문은 JavaScript 프로그램이 구성되는 규칙의 집합입니다.

// How to create variables:
var x;
let y;

// How to use variables:
x = 5;
y = 6;
let z = x + y;

자바스크립트 값

JavaScript 구문은 두 가지 유형의 값을 정의합니다.

  • 고정 값
  • 변수 값

고정 값을 리터럴 이라고 합니다.

변수 값을 변수 라고 합니다.


자바스크립트 리터럴

고정 값에 대한 가장 중요한 두 가지 구문 규칙은 다음과 같습니다.

1. 숫자 는 소수를 포함하거나 포함하지 않고 작성됩니다.

10.50

1001

2. 문자열 은 큰따옴표나 작은따옴표로 묶인 텍스트입니다.

"John Doe"

'John Doe'


자바스크립트 변수

프로그래밍 언어에서 변수 는 데이터 값 을 저장 하는 데 사용 됩니다.

JavaScript는 키워드 var를 사용 let하고 변수 const선언 합니다.

등호 는 변수에 값을 할당 하는 데 사용됩니다 .

이 예에서 x는 변수로 정의됩니다. 그런 다음 x에 값 6이 할당됩니다.

let x;
x = 6;

자바스크립트 연산자

JavaScript는 산술 연산자 ( + - * /)를 사용하여 값 을 계산 합니다.

(5 + 6) * 10

JavaScript는 할당 연산자 ( =)를 사용 하여 변수에 값을 할당 합니다.

let x, y;
x = 5;
y = 6;

자바스크립트 표현식

표현식은 값을 계산하는 값, 변수 및 연산자의 조합입니다.

계산을 평가라고 합니다.

예를 들어 5 * 10은 50으로 평가됩니다.

5 * 10

표현식에는 변수 값도 포함될 수 있습니다.

x * 10

값은 숫자 및 문자열과 같은 다양한 유형일 수 있습니다.

예를 들어 "John" + " " + "Doe"는 "John Doe"로 평가됩니다.

"John" + " " + "Doe"

자바스크립트 키워드

JavaScript 키워드 는 수행할 작업을 식별하는 데 사용됩니다.

let키워드는 브라우저에 변수를 생성하도록 지시합니다 .

let x, y;
x = 5 + 6;
y = x * 10;

또한 이 var키워드는 브라우저에 변수를 생성하도록 지시합니다.

var x, y;
x = 5 + 6;
y = x * 10;

이 예에서 var 또는 let를 사용하면 동일한 결과가 생성됩니다.

이 자습서의 뒷부분에서 자세한 내용을 배웁니다 var .let


자바스크립트 주석

모든 JavaScript 문이 "실행"되는 것은 아닙니다.

이중 슬래시 //또는 /*및 사이의 코드는 주석*/ 으로 처리됩니다 .

주석은 무시되며 실행되지 않습니다.

let x = 5;   // I will be executed

// x = 6;   I will NOT be executed

주석에 대한 자세한 내용은 이후 장에서 배우게 됩니다.


자바스크립트 식별자/이름

식별자는 JavaScript 이름입니다.

식별자는 변수, 키워드, 함수의 이름을 지정하는 데 사용됩니다.

법적 이름에 대한 규칙은 대부분의 프로그래밍 언어에서 동일합니다.

JavaScript 이름은 다음으로 시작해야 합니다.

  • 문자(AZ 또는 az)
  • 달러 기호($)
  • 또는 밑줄(_)

후속 문자는 문자, 숫자, 밑줄 또는 달러 기호일 수 있습니다.

메모

이름의 첫 문자로 숫자를 사용할 수 없습니다.

이런 식으로 JavaScript는 식별자와 숫자를 쉽게 구별할 수 있습니다.


JavaScript는 대소문자를 구분합니다

모든 JavaScript 식별자는 대소문자 를 구분 합니다. 

변수 lastNamelastname는 두 개의 다른 변수입니다.

let lastname, lastName;
lastName = "Doe";
lastname = "Peterson";

JavaScript는 LET 또는 Let 을 키워드 let 으로 해석하지 않습니다 .


자바스크립트와 카멜 케이스

역사적으로 프로그래머는 여러 단어를 하나의 변수 이름으로 결합하는 다양한 방법을 사용했습니다.

하이픈:

이름, 성, 마스터 카드, 도시 간.

하이픈은 JavaScript에서 허용되지 않습니다. 뺄셈을 위해 예약되어 있습니다.

밑줄:

first_name, last_name, master_card, inter_city.

어퍼 카멜 케이스(파스칼 케이스):

이름, 성, 마스터카드, 인터시티.

낮은 낙타 케이스:

JavaScript 프로그래머는 소문자로 시작하는 카멜 케이스를 사용하는 경향이 있습니다.

이름, 성, 마스터 카드, 인터시티.


자바스크립트 문자 집합

JavaScript는 유니코드 문자 집합을 사용합니다.

유니코드는 (거의) 세계의 모든 문자, 구두점 및 기호를 다룹니다.

자세히 알아보려면 전체 유니코드 참조 문서를 참조 하십시오.