JavaScript 총정리

JavaScript는 웹 개발에서 필수적인 프로그래밍 언어로 웹 페이지의 두뇌와 같습니다.

JavaScript의 핵심 개념을 간단하게 정리해 보겠습니다.

1. 변수

데이터를 저장하는 상자입니다. 저장하는 데이터의 종류로는 숫자, 문자열, 불리언, 객체 등이 있습니다.

let 키워드로 재할당 가능한 변수 선언

let name = '코드프렌즈';

2. 함수

특정 작업을 수행하는 재사용 가능한 코드 블록입니다.

greet 함수 선언

function greet(userName) {
  console.log('안녕하세요, ' + userName + '님!');
}

greet('코드프렌즈'); // "안녕하세요, 코드프렌즈님!" 출력

3. 조건문

조건에 따라 다른 코드를 실행합니다.

if-else 조건문

if (name === '코드프렌즈') {
  console.log('안녕하세요, 코드프렌즈님!');
} else {
  console.log('안녕하세요, 손님!');
}

4. 반복문

조건에 따라 코드 블록을 여러 번 반복합니다.

for 반복문

for (let i = 0; i < 5; i++) {
  console.log(i); // 0부터 4까지 출력
}

5. 객체

속성과 값을 가진 데이터 모음입니다. 속성은 키(Key)라고도 부릅니다.

person 객체

const person = {
  name: '코드프렌즈', // name 속성, 문자열 값
  age: 25, // age 속성, 숫자 값
  greet: function () { // greet 속성, 함수 값
    console.log('안녕하세요, ' + this.name + '님!');
  },
};

person.greet(); // "안녕하세요, 코드프렌즈님!" 출력

6. 이벤트

웹 페이지에서 발생하는 사용자의 버튼 클릭, 입력폼 제출, 웹 페이지 로드과 같은 다양한 사건을 뜻합니다.

버튼 클릭 이벤트 감지

let button = document.querySelector('button');

// 버튼 클릭 이벤트 리스너
button.addEventListener('click', function () {
  alert('버튼을 클릭했어요!');
});

다음 내용이 궁금하다면?

코드프렌즈 PLUS 멤버십 가입 or 강의를 등록해 주세요!

강의 등록하기로그인하기