개인 공부/JavaScript

[자바스크립트 비기너] 1. 기본 문법

240 • 사공이 2021. 10. 7. 23:22

1. 강좌 환경, Hello JavaScript

defer 속성을 작성하면 body까지 렌더링한 후 js 파일을 실행한다.

2. 문장

Statement

  • JS 코드 실행 단위
  • 세미콜론까지가 하나의 문장이다.

문장 시작 위치

  • 위치 제약 없음
  • 가독성을 위해 들여쓰기를 사용한다. 단, 일관되게 들여쓰기를 하자!

3. 변수

  • 값을 저장하는 영역
  • 변수에 저장된 값을 재사용하기 위해 사용한다.

변수 선언 방법

var book = "책", point = 123;

var book = "책",  
point = 123;
  • 콤마(,)로 구분하여 다수의 변수를 선언할 수 있다. 두 번째 값 이후부터는 변수 이름만 작성한다.
  • 줄을 바꾸어서 여러 개의 변수를 작성할 수도 있다.
  • 의미를 부여하여 변수를 작성해야 한다. 이를 시맨틱(Semantic)이라고 한다.
  • 변수 이름은 포괄적이지 않고 구체적일수록 좋다.
// 나중에 할당한 값으로 바뀜
var point = 123, point = 456; 

point = 789;

// 같은 값 할당
var point = amount = 123;
  • 자바스크립트 코드는 왼쪽에서 오른쪽으로 처리를 한다.
  • 오래된 브라우저에서는 같은 값을 할당할 경우 값이 연동되는 경우가 있다. (ex. amount의 값을 변경하면 point의 값도 함께 변경)

4. 주석

  • 한 줄 주석
  • 블록 주석JS 스펙
  • 자바스크립트 문법을 작성한 문서
  • ES3, ES5는 JS 스펙의 에디션이다.
  • 자바스크립트는 프로그래밍 언어, 자바스크립트 엔진은 컴파일 등을 하는 처리 측면을 의미한다.

5. console.log()

console.log()는 JS에서 제공하는 것은 아니라 Console API에서 제공하는 것이다.

6. 정수, 실수

  • JS는 정수와 실수를 구분하지 않는다.
  • 1, 1., 1.0 모두 1.0으로 간주하지만 표시는 1로 표시한다.
  • JS는 64비트 부동 소수점 처리를 한다. (ex. 123을 123.0으로 처리)
  • 정수와 실수를 구분하는 언어에서는 정수와 실수를 더할 수 없다. 그러나 JS는 둘을 구분하지 않고 실수로 계산을 한다.

7. 상수, 진수

상수

  • 변경할 수 없는 값
  • 상수 변수: 상수가 설정된 변수 (JS는 변수의 값을 변경할 수 있기 때문에 선언적인 의미이다.)
  • 코딩 관례로 영문 대문자 이름을 사용한다. (ex. var ONE = 1;)
  • Number.MAX_VALUE와 같이 JS에서 제공하는 상숫값은 변경할 수 없다.진수
  • 10진수 (ex. 123)
  • 16진수 (ex. 0xFF, 대소문자 구분하지 않는다.)
  • 8진수 (ES3에서 폐지되었다가 ES6에서 재정의되었다.)
  • 2진수 (ES6에서 특별한 방법으로 제공한다. 비트를 조합하여 표현)

8. 데이터 타입(Data Type)

데이터 타입의 형태

  • 숫자 타입
  • 문자 타입typeof 연산자
  • 데이터 타입을 반환한다.데이터는 타입을 가진다.
  • var point = 123; console.log(typeof point); // number 출력
  • JS는 데이터를 기준으로 타입을 결정한다.
  • 타입을 먼저 선언하고 타입에 맞는 데이터를 할당하는 것이 아니다.

9. Number, String 타입

언어 타입

  • JS 프로그램에서 사용 가능한 타입
  • ex. Undefined, Null, Boolean 등스펙(문서) 타입
  • 언어 알고리즘을 위한 타입으로 JS 프로그램에서 사용할 수 없다.Number 타입
  • 부호를 가진 값
  • 특수한 세 가지 값: Nan(Not-a-Number), Infitnity, -InfinityString 타입
  • 문자 타입
  • 큰 따옴표를 사용하고 싶을 때는 작은 따옴표 안에 큰 따옴표를 작성하고, 반대의 경우도 동일한 방법으로 작성한다.

10. Undefined, Null 타입

Undefined

  • Undefined는 스펙에서 사용하는 타입이고 undefined는 값이다.
  • 변수의 디폴트 값
  • 변수를 선언만 했을 때는 undefined가 초깃값으로 설정된다.
  • 변수에 값을 할당하지 않았음을 나타내는 시맨틱이다.
  • 자바스크립트에서는 반드시 변수가 이름과 값을 갖는 구조로 이루어져야 한다. 이를 맞추기 위해 undefined가 필요하다.
  • undefined도 값이기 때문에 변수에 이를 할당할 수 있다. 그러나 이렇게 하면 변수에 값이 할당되지 않았는지 구분하기 어렵다.

Null

  • Null은 타입, null은 값이다.null과 undefined의 차이
  • undefined는 단지 변수만 선언한 것.
  • null은 반드시 의도적으로 값을 할당해야 한다. 즉 코드를 수행한 것이 된다.

11. Boolean, Object 타입

Boolean

  • true, falseObject (대문자)

Object (대문자)

  • {name: value} 형태. (JS는 이름과 값 구조!)
  • name과 value 한 쌍을 property라고 한다.타입 정리
  • JS의 기본 데이터 타입을 Primitive 타입이라고 한다.
  • typeof 연산자의 한계 - typeof null은 object를 반환한다. ES6에서는 이를 해결할 수 있다.