JavaScript
1.ECMAScript(ES)가 원래 명칭이다.
2.<script> 태그 내부에 작성한다. <script>태그의 위치는 정해져 있지 않다.
(<head>, <body> 모두 가능)
3. HTML 구성 요소의 생성/삭제/수정 작업을 할 수 있다.
변수(Variable)
-
기본 자료형
1) number : 정수/실수 구분이 없다. NaN(Not a Number), Infinity/-Infinity(+0/-0으로 나눌 때 발생)
2) string : 문자/문자열 구분이 없다. 작은 따옴표('')와 큰 따옴표("")를 모두 사용할 수 있다.
3) boolean : true/false
4) null : 변수에 null을 저장한 경우(없는 값을 저장한 경우, 초기화를 위해 저장한 경우)
5) undefined : 변수에 어떤 값도 저장된 적이 없는 경우 -
특징
1) Dynamic type(동적 타입)이다.
2) 변수를 선언할 때 자료형이 결정되지 않는다.
3) 변수에 값을 저장할 때 자료형이 결정된다.
4) 변수에 저장된 값을 바꾸면 자료형도 함께 바뀐다. -
변수 선언 키워드
| scope | 변수 선언 | 초기화 | 재선언 | 용도
---------|-----------------|-----------|---------- |-------|----------------
1) var | function level | 생략 가능 | 생략 가능 | 가능 | 함수, 전역 변수
2) let | block level({}) | 생략 불가능 | 생략 가능 | 불가능 | 지역 변수
3) const | block level({}) | 생략 불가능 | 생략 불가능 | 불가능 | 상수변수선언 예)
// 변수 선언(초기화가 없으면 undefined)
var a;
console.log(a, a + 1); // undefiend, NaN
// 변수 재선언(값이 저장되면서 타입이 결정됨)
var a = 10;
console.log(typeof a, a, a / 0); // number, 10, Infinity
// 저장된 값이 바뀌면 타입도 바뀜
a = 'tom';
console.log(typeof a, a);
// 변수 선언 생략
b = true;
console.log(typeof b, b);
JavaScript의 출력 방식
1.경고창
alert(출력메시지)
2.브라우저 화면 출력
document. write(출력메시지)
3.콘솔 출력 (F12 - Console 탭)
console.log(출력메시지)
ex)
alert('Hello World');
document.write('<h1>Hello World</h1>');
console.log('Hello World');자료형 변환하기
- number -> string
1) String(number) 함수
2) number + '' - String -> number
1) Number(string) 함수
2) parseInt(string) 함수
3) parseFloat(string)함수
호이스팅(Hoisting)
- JavaScript 인터프리터가 함수나 변수의 선언 이전에 미리 메모리 공간을 할당하는 것을 의미한다.
- var 키워드로 선언한 변수는 호이스팅 시 undefined 값을 가진다.
- let 키워드로 선언한 변수는 호이스팅 시 초기화되지 않는다.
- 함수의 정의보다 함수의 호출을 먼저 할 수 있다.
- 변수의 선언보다 변수의 사용을 먼저 할 수 있다.
- 변수의 선언과 초기화가 함께 진행되는 경우 선언부와 초기화를 분리하여 처리한다.
호이스팅 예시
// var 키워드 호이스팅 - 1
x = 10;
console.log(x);
var x; // 변수 선언은 다른 코드보다 항상 먼저 처리된다. 이걸 호이스팅이라고 한다.
// var 키워드 호이스팅 - 2
console.log(y); // undefined
var y = 20; // var y; y = 20; 으로 분리해서 호이스팅된다.
console.log(y); // 20
// var 키워드 호이스팅 - 2(아래 순서로 실행되는 것으로 이해하기)
// var y; → var 키워드로 호이스팅 된 변수는 undefined로 초기화된다.
// console.log(y); → undefiend
// y = 20; → 20을 저장
// console.log(y); → 20
// let 키워드 호이스팅
console.log(z); // Reference Error 발생
let z = 30; // let z; z = 30; 으로 분리해서 호이스팅된다.
console.log(z);
// let 키워드 호이스팅(아래 순서로 실행되는 것으로 이해하기)
// let z; → let 키워드로 호이스팅 된 변수는 초기화되지 않는다.
// console.log(z); → Reference Error 발생
// z = 30; → 30을 저장
// console.log(z); → 30
졸려요