3. 자바스크립트(JavaScript) 기초 문법(3)

1. 자바스크립트 문장 구조

• 코드(Code)
  • 문법을 토대로 단어의 조합으로 하나의 문장을 만들어내는 사람의 언어처럼 프로그래밍 언어도 문장을 구성하는 문장을 코드라 합니다.
  • 코드를 구성하는 가장 작은 기본단위는 값, 변수, 연산자, 키워드입니다.
    => 이 요소가 모여서 하나의 문장을 만듭니다.
• 구문 패턴
  • 표현식(Expressions)
    • 값을 생성합니다.
    • 표현식은 모두 어떤 값을 이행하지만, 개념적으로는 두 가지로 나뉩니다.
      • 부수 효과가 있는 표현식 ex) x = 7
      • 평가하면 어떤 값으로 이행하는 표현식 ex) 3+4
  • 명령문(Statements)
    • 일종의 행동 또는 행우를 수행하게 하는 코드입니다.
    • if, if-else, for 등이 있습니다.
• 표현식 명령문(Expression Statement)
  • 프로그래밍에서 문장은 명령문으로 구성되는데 명령문을 작성하는 데 표현식이 대신 쓰일 수도 있습니다.
  • 이러한 문장을 표현식 명령문이라고 부릅니다.

function greeting() {
  // 함수 몸통(Body)에는 보통 명령문으로 작성하지만, 표현식을 사용할 수 있음
  "hello"
  "world"
}

// 함수 인자에는 값을 넣어야 하는데 인자에 표현식 대신 명령문이 들어가서 잘못된 문장으로 오류 발생
greeting(true){ console.log("It is not acceptable") }   // error

2. 자바스크립트 주석

• 주석(Comment)
  • 코드 결과를 실행하지 않는 문장을 말합니다.
  • 자바스크립트 엔진이 소스코드를 해석할 때 주석을 무시하게 됩니다.
    => 코드 실행에 영향을 주지 않습니다.
  • //
    • 한 문장을 주석 처리할 때 사용합니다.
    • 코드와 동일한 라인에서 주석처리도 가능합니다.
      => 기호 사용 후 작성된 내용이 주석처리되기 때문
  • /* */
    • 블록 단위로 주석 처리할 때 사용합니다.
    • 반드시 /* 로 시작하고 */ 로 닫아야 합니다.
    • 내부에 작성된 모든 내용이 주석처리됩니다.

4. 자바스크립트 자료형

• 프로그래밍 언어는 값을 특정 유형으로 분류하는데 특정 유형을 다른 말로 하면 자료형이나 타입(type)이라 부릅니다.
• 자바스크립트는 크게 두 가지 타입으로 구분합니다.
  • 원시 타입(Primitive Data Type)
    • 값이 변수에 할당될 때 메모리 상에 고정된 크기로 저장합니다.
    • 원시 타입의 값은 변경 불가능한 값, 불변값(Immutable Value)을 받습니다.
    • 원시 타입의 데이터 타입으론 숫자형(Number), 불린형(Boolean), 문자형(String), 심볼형(Symbol), null, undefined 가 있습니다.
    • ⅰ) 숫자형(Number)
      • 숫자를 표현하는 자료형입니다.
      • 숫자 안에서도 정수, 실수 등 여러 종류로 구분하지만, 자바스크립트는 그 종류들을 숫자형 하나로 포괄합니다.
      • 숫자형끼리 연산이 가능합니다.
    • ⅱ) 문자형(String)
      • 작은따음표'' 나 큰따옴표"" 를 양 끝에 두고, 그 안에 한 글자 이상의 문자, 기호, 숫자가 있는 자료형을 문자형이라 합니다.
    • ⅳ) 불린형(Boolean)
      • 참(true), 거짓(false) 두 가지 값을 가집니다.
    • ⅴ) 심볼형(Symbol)
      • ES6부터 추가된 원시 자료형입니다.
      • 다른 원시형과 다르게 유일하게 변경이 불가능한 자료형입니다.
      • 참조형의 키(key)로도 사용이 가능합니다.
    • ⅵ) null, undefined
      • null 은 빈 값 undefined 는 존재하지 않은 값을 의미합니다.
  • 참조 타입(Reference Data Type)
    • 변수에 고정된 크기를 저장하지 않고, 값의 메모리 주소를 참조합니다.
    • 참조 타입의 데이터 타입으로 객체(Object)가 있습니다.
    • 객체는 속성들(Properties)의 집합을 의미하고 집합 내부에는 순서도 크기도 고정되어 있지 않습니다.
    • 고정되지 않은 값을 변수에 할당하려면 해당 값을 저장할 수 없으나 참조하는 것은 가능합니다.
      => 참조 타입은 값의 메모리 주소를 변수에 할당하여 값을 참조합니다.
    • 메모리 주소를 통해 값을 참조한다는 의미는 "주소"라는 의미 그대로 해석하면 됩니다.
    • 변수의 값을 불러오면 저장되어 있는 메모리 주소를 찾아서 값을 가져옵니다.
    • ⅰ) 객체(Object)
      • {} 안에 키: 값 의 형태로 이루어진 속성들의 모음입니다.
      • 키는 반드시 문자(String) 자료형이어야 하고 이 속성 키를 통해 해당 속성에 매핑된 값에 접근할 수 있습니다.
      • 객체의 종류
        • ⅰ) Global Object 객체
          • 모든 객체의 부모가 되는 객체입니다.
        • ⅱ) 표준 내장 객체
          • Global Object 를 부모 삼아 함수(Function), 배열(Array), 원시 자료형을 객체로 감싼 새로운 형태의 객체(String, Number, Boolean)와 특수 연산에 특화된 내장 객체(Math, JSON, RegEx) 그리고 Iterable과 Collection 특성의 객체 (Map, Set, WeakMap, WeakSet)이 있습니다.

const num = 7  // 숫자형(Number)
const s = "Seven"  // 문자형(String)
const isTrue = true  // 불린형(Boolean)
const empty = null  // null
let nothing  // undefined
const sym = Symbol("me")  // Symbol
const item = {   // 객체(Object)
  price: 10000,
  count: 7
}
const color = ["SkyBlue", "Pink", "Black", "Aquamarine",  "gold", "DarkGreen", "Violet"]  // 배열(Arry)
const addColor = function(color){   // 함수(Function)
  color.push(color)
}
addColor("red")
console.log(color)  // ["SkyBlue", "Pink", "Black", "Aquamarine",  "gold", "DarkGreen", "Violet", "red"]

5. 콘솔(console)

• 콘솔(console)은 자바스크립트의 내장 객체입니다.
• console의 메소드
•  
  • log
    • console.log(message) -> 괄호 안에 대입된 값을 로그 메세지로 출력합니다.
  • debug
    • console.debug(디버그-로그) -> 메세지를 "디버그" 중요도로 콘솔에 출력하고, 디버그 중요도 메세지는 별도 설정 없이는 보이지 않습니다.
  • error
    • console.error(에러) -> 에러 메세지를 출력
  • info
    • console.info(정보) -> 정보성 메세지를 출력
  • warn
    • console.warn(경고) -> 경고성 메세지를 출력

const str = "JavaScript"
const num = 7
const arr = [1, 2, 3, 4, 5]
const obj = {a: 1, b: 2}
console.log(str)  // JavaScript
console.log(num)  // 7
console.log(arr)  // [1, 2, 3, 4, 5]
console.log(obj)  // {a: 1, b: 2}