[JS] JavaScript 소개와 기본 구문

JavaScript(자바스크립트)는 웹 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나로, 웹 페이지를 동적으로 만들고 상호작용할 수 있도록 도와주는 스크립트 언어입니다. 웹 브라우저에서 실행되며, HTML과 함께 사용하여 웹 페이지의 동작을 제어하고 사용자와의 인터랙션을 처리합니다.

---

자바스크립트의 역할

자바스크립트는 다음과 같은 역할을 수행합니다:

 

• 웹 페이지의 동적인 요소 생성과 제어
• 사용자 입력에 대한 응답 처리
• 데이터의 유효성 검사와 처리
• 웹 페이지의 외부 API와의 연동 (예: 지도 서비스, 소셜 미디어 등)
• 애니메이션과 효과 추가
• 웹 페이지의 상태 관리와 이벤트 처리

---

기본 구문

변수 선언과 할당
변수는 값을 저장하는데 사용되며, var, let, const 키워드를 사용하여 선언합니다.

var name = 'John';
let age = 30;
const PI = 3.14;

 

데이터 타입
자바스크립트는 동적 타이핑 언어로, 변수의 데이터 타입은 자동으로 결정됩니다.

let message = 'Hello'; // 문자열
let count = 10; // 숫자
let isTrue = true; // 불리언
let fruits = ['apple', 'banana', 'orange']; // 배열
let person = { name: 'John', age: 30 }; // 객체

 

함수
함수는 코드를 재사용하고 구조화하는데 사용됩니다.

function add(a, b) {
    return a + b;
}

let result = add(3, 5); // 8

 

조건문과 반복문
조건문과 반복문을 사용하여 조건에 따라 코드 블록을 실행하거나 반복적인 작업을 수행합니다.

let num = 10;

if (num > 0) {
    console.log('양수입니다.');
} else if (num < 0) {
    console.log('음수입니다.');
} else {
    console.log('0입니다.');
}

for (let i = 0; i < 5; i++) {
    console.log(i);
}

 

이벤트 처리
자바스크립트를 사용하여 웹 페이지에서 발생하는 이벤트를 처리할 수 있습니다.

<button id="btn">클릭</button>

<script>
    document.getElementById('btn').addEventListener('click', function() {
        alert('버튼이 클릭되었습니다!');
    });
</script>

---

자바스크립트는 웹 개발에서 필수적인 언어로, HTML과 함께 사용하여 웹 페이지를 동적으로 만들고 사용자와의 인터랙션을 처리합니다. 변수 선언과 할당, 함수, 조건문, 반복문, 이벤트 처리 등 기본적인 구문을 통해 웹 페이지에 다양한 동작과 효과를 추가할 수 있습니다. 웹 개발에 입문하신다면 자바스크립트를 학습하고 활용하여 동적이고 인터랙티브한 웹 페이지를 개발해보시기 바랍니다!