JS공식문서 읽기 스터디 2일차 ) JavaScript가 무엇인지, 기본 문법 파악하기

JavaScript는 무엇인가

• 웹 페이지를 대화형(애니메이션, 버튼 클릭, 팝업 등)으로 만드는 크로스 플랫폼, 객체 지향 스크립트 언어.

활용 환경

• 클라이언트 측 (JavaScript in Browser) → DOM 제어, 이벤트 처리(클릭, 입력, 탐색 등)
• 서버 측 (Node.js 등) → DB 통신, 파일 조작, 여러 컴퓨터 간 실시간 협업

구성 요소

1. 표준 라이브러리 (ex: Array, Date, Math)
2. 연산자, 제어 구조, 명령문 등 언어 기본 요소
3. 확장성: 코어 JS 위에 추가 객체(API)를 붙여 다양한 목적에 맞게 확장

---

Java와의 차이점

구분	JavaScript	Java
객체 지향 방식	프로토타입 기반 상속, 객체에 동적 속성/메서드 추가 가능	클래스 기반 상속, 동적 속성/메서드 추가 불가
변수 자료형	동적 타입, 느슨한 형 지정	정적 타입, 강한 형 지정
디스크 접근	직접 작성 불가	직접 작성 가능

---

관련 문서

• 엔진 구현자용 표준문서: ECMAScript 최신버전
• 개발자용 가이드: MDN JavaScript Guide

---

웹 콘솔에서 한 줄 입력하기

• 단축키: cmd + opt + k (Mac)
• 동작 원리: eval()과 동일

---

문법

기본 문법

(1) 대소문자 구별 & 유니코드 문자셋 지원

let myVar = 10;
let myvar = 20;

console.log(myVar); // 10
console.log(myvar); // 20  (대소문자 다르므로 별개 변수)

(2) 명령 = 명령문(statement), 세미콜론(;)으로 구분

주석

// 한 줄 주석

/* 여러 줄 주석 */

/* 그러나, /* 중첩된 주석은 불가 */ SyntaxError */

---

변수 선언과 스코프

키워드	스코프	재선언	재할당	특징
var	함수 스코프	가능	가능	오래된 방식, 호이스팅 시 undefined로 초기화
let	블록 스코프	불가	가능	값 변경 가능, TDZ 존재
const	블록 스코프	불가	불가	읽기 전용 상수, 반드시 초기화 필요

• 최근에는 예측가능성 때문에 const 사용이 선호됨
  👉 관련 아티클

---

구조 분해 할당

객체나 배열에서 값을 꺼내 변수로 선언 가능

let foo = { bar: 10, baz: 20 };
let { bar } = foo;   // bar = 10

---

변수 할당과 값

• var / let: 초기화하지 않으면 → undefined
• const: 초기화 필수, 없으면 SyntaxError
• 선언되지 않은 변수 접근 → ReferenceError

📌 값의 동작

• undefined: 불리언 → false, 수치 → NaN
• null: 불리언 → false, 수치 → 0

---

호이스팅

• 정의: 변수 선언이 스코프 최상단으로 끌어올려지는 것
• var → undefined로 초기화
• let/const → TDZ(Temporal Dead Zone) 때문에 선언 전 접근 시 ReferenceError

---

전역 변수

• 전역 변수 = 전역 객체(window)의 속성
• window.variable 형태로 접근 가능
• iframe 간 접근도 parent.variable로 가능

---

상수 (const)

• 읽기 전용 상수, 선언 시 반드시 초기화 필요
• 객체/배열 내부 값은 변경 가능

const MY_OBJECT = { key: "value" };
MY_OBJECT.key = "otherValue"; // ✅ 가능

const MY_ARRAY = ["HTML", "CSS"];
MY_ARRAY.push("JS"); // ✅ 가능

---

데이터 타입

구분	정의	특징	예시
원시 타입 (Primitive, 7개)	더 이상 쪼갤 수 없는 단일 값	- 불변(immutable) - 값 전달(pass-by-value) - 오토 박싱(auto-boxing) 일시적 래퍼 객체	Boolean, null, undefined, Number, BigInt, String, Symbol
객체 타입 (Object, 1개)	키-값 쌍과 메서드를 담는 참조형 데이터	- 가변(mutable) - 참조 전달(reference) - 여러 변수가 같은 객체 공유	{}, [], function, Date, RegExp, Map, Set

---

자료형 변환

• 동적 타입 언어 → 실행 도중 타입 변경 가능
• 문자열 ↔ 숫자 변환 가능

parseInt("101", 2); // 5
+'1.1' + +'1.1';   // 2.2

---

리터럴

• 배열 리터럴: let arr = [1,2,3];
• 객체 리터럴: let obj = {a:1, b:2};
• 정규식 리터럴: /ab+c/;
• 문자열 리터럴: "foo", 'bar', `Hello ${name}`

---