JavaScript 기초

기술노트

JavaScript 기초

JavaScript는 웹 페이지를 더욱 역동적이고 사용자 친화적으로 만들어주는 프로그래밍 언어이다. 주로 웹 브라우저에서 실행되며, 최근에는 Node.js를 통해 서버에서도 널리 사용되고 있다.

JavaScript 개요

JavaScript의 역할

JavaScript는 다음과 같은 주요 역할을 수행한다:

  • 동적인 기능 추가: 버튼 클릭, 폼 전송 등 사용자 상호작용 처리
  • 비동기 통신: 페이지 새로고침 없이 서버와 데이터 교환 (AJAX 등)
  • 웹 애플리케이션 개발: Gmail, Facebook 등 복잡한 웹 앱 구현

JavaScript 작성 및 실행 방법

HTML 문서와 연결하는 방법은 다음과 같다:

  1. 인라인 스크립트: HTML 요소 내부에 직접 작성
  2. 내부 스크립트: `<script>` 태그 안에 작성
  3. 외부 스크립트: 별도의 `.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");