JavaScript 기초
기술노트
JavaScript 기초
JavaScript는 웹 페이지를 더욱 역동적이고 사용자 친화적으로 만들어주는 프로그래밍 언어이다. 주로 웹 브라우저에서 실행되며, 최근에는 Node.js를 통해 서버에서도 널리 사용되고 있다.
JavaScript 개요
JavaScript의 역할
JavaScript는 다음과 같은 주요 역할을 수행한다:
- 동적인 기능 추가: 버튼 클릭, 폼 전송 등 사용자 상호작용 처리
- 비동기 통신: 페이지 새로고침 없이 서버와 데이터 교환 (AJAX 등)
- 웹 애플리케이션 개발: Gmail, Facebook 등 복잡한 웹 앱 구현
JavaScript 작성 및 실행 방법
HTML 문서와 연결하는 방법은 다음과 같다:
- 인라인 스크립트: HTML 요소 내부에 직접 작성
- 내부 스크립트: `<script>` 태그 안에 작성
- 외부 스크립트: 별도의 `.js` 파일로 작성 후 `<script src="...">`로 연결 (권장)
변수와 데이터 타입
변수 선언
변수는 데이터를 저장하는 공간이다:
- var: 구버전 방식, 스코프와 호이스팅 문제로 권장하지 않음
- let: 변경 가능한 데이터를 저장할 때 사용
- const: 변경 불가능한 데이터를 저장할 때 사용
기본 데이터 타입
- String (문자열): 텍스트 데이터
- Number (숫자): 정수와 소수
- Boolean (불리언): 참(`true`) 또는 거짓(`false`)
- Undefined: 초기화되지 않은 변수의 타입
- Null: 의도적으로 '없음'을 명시
참조 데이터 타입
- Object (객체): 키-값 쌍으로 다양한 데이터 저장
- Array (배열): 순서가 있는 데이터 집합
- Function (함수): 특정 작업을 수행하는 코드 블록
연산자
- 산술 연산자: `+`, `-`, `*`, `/`, `%`
- 비교 연산자: `==`, `===`, `!=`, `!==`, `<`, `>`, `<=`, `>=`
- 논리 연산자: `&&`(AND), `||`(OR), `!`(NOT)
조건문과 반복문
- if 문: 특정 조건이 참일 때 코드 실행
- switch 문: 여러 경우 중 하나를 선택
- for 문: 정해진 횟수만큼 반복
- while 문: 조건이 참일 때 반복
함수
함수는 특정 작업을 재사용할 수 있게 해준다:
- 선언식 함수 (Function Declaration)
- 표현식 함수 (Function Expression)
- 화살표 함수 (Arrow Function, ES6)
예시: ```javascript // 선언식 function greet() { console.log("Hello"); }
// 표현식 const greet = function() { console.log("Hello"); };
// 화살표 함수 const greet = () => console.log("Hello");