[2025 1학기 React.js 스터디] 최은희 #1주차

#자바스크립트?

-웹 개발에서 가장 많이 사용되는 프로그래밍 언어 중 하나로,

HTML과 CSS와 함께 웹 페이지를 동적으로 만드는 데 사용한다. 

 

#콘솔

-개발자가 코드 실행 결과를 확인하고, 디버깅할 수 있도록 도와주는 도구

-console.log() - 일반 출력을 할 때 이용

 

#주석

- 코드에 대한 설명을 추가하는 역할, 실행되지 않는 텍스트

- 한 줄짜리 주석을 작성할 때는 // 를 사용

- 여러 줄의 주석을 작성할 때는 /* */을 사용

 

#변수와 상수

 

-변수와 상수는 데이터를 저장하는 공간,

변수는 값을 변경할 수 있지만, 상수는 한 번 할당되면 변경할 수 없다.

- let - 변경 가능한 변수

- const - 변경할 수 없는 변수

 

#자료형

- string - 문자열: ", '으로 감싸서 표현

- number - 숫자: 정수와 실수 구분 없이 number 타입으로 처리

- boolean - 논리값: true(참) 또는 false(거짓) 값을 가질 수 있다.

- ndefined - 값이 없음 :변수를 선언했지만 값을 할당하지 않으면 undefined가 된다.

- null - 의도적으로 없음: "값이 없음"을 의도적으로 표현

 

#연산자

- 산술 연산자

 

연산자	설명	예제	결과
+	덧셈	5+3	8
-	뺄셈	5-3	2
*	곱셈	5*3	15
/	나눗셈	6/3	2
%	나머지	5%2	1
**	거듭제곱	2**3	8

 

-비교 연산자

연산자	설명	예제	결과
==	값이 같음(타입비교X)	5=="5"	true
===	값과 타입이 같음	5==="5"	false
!=	값이 다름	5!="5"	false
!==	값과 타입이 다름	5!=="5"	true
>	초과	10>5	true
<	미만	10<5	false

 

#객체와 배열

- 객체는 여러 개의 데이터를 하나의 단위로 묶어서 저장하는 자료형,
key: value(속성) 형태로 값을 저장하며, 속성이나 메서드를 가질 수 있다.

- 배열은 여러 개의 값을 순서대로 저장하는 자료구조,
배열의 값(요소)은 인덱스(index) 번호(0부터 시작)를 통해 접근할 수 있다.

 

#if/else문

- if 문은 조건이 true일 때만 실행,

if(조건) → 조건이 참(true)이면 {} 안의 코드 실행
조건이 거짓(false)이면 {} 내부 코드는 실행되지 않음

-if-else 문: if의 조건이 false일 때 다른 코드를 실행하려면 else를 추가

-여러 개의 조건을 확인하고 싶다면 else if를 사용

 

#switch문

- 여러 개의 if-else if 조건문을 대체할 때 사용

-1. switch 문에 주어진 값이 case 값과 일치하는지 확인

2. 일치하는 case를 찾으면 해당 블록을 실행

3. break가 나오면 switch 문 종료

4. 모든 case와 일치하지 않으면 default 블록 실행 (생략 가능)

- break는 case 블록 실행 후 빠져나가는 역할,
만약 break가 없으면 다음 case까지 실행

 

+) switch vs if-else

- if-else가 유리한 경우

• 범위(>, <, >=, <=) 비교가 필요할 때
• 복잡한 조건을 처리할 때

- switch가 유리한 경우

• 값이 정확하게 일치할 때 (=== 비교)
• 많은 else if를 대체할 때 가독성이 좋아짐