[2023 신입부원 심화 스터디] 황현진 #2주차 - 기초문법 part.2, 3

📌 조건문

• if문

if(조건1){ 조건1이 참일 때 실행될 코드 }
// 코드가 한 줄 일때는 중괄호를 생략해도 된다.
else if(조건2){ 조건2가 참일 때 실행될 코드 }
else{ 모든 조건이 거짓일 때 실행될 코드 }

⚠️주의할 점
     : 하나의 조건문을 작성할 때 if, else는 한 번만 사용, if로 시작, else로 끝나야함(else는 없어도 된다.)

 

• switch문
  (if문과의 차이점: 동일한 조건이 주어지고 그 조건의 값에 따라서 다른 코드를 실행하도록 함)

switch(조건){
	case 값:
		실행할 코드
		break;
	case 값:
		실행할 코드
		break;
	default:
		위의 값 중 참이 되는 것이 없을 경우 실행되는 코드
}

⚠️주의할 점
      : break를 써줘야한다.

 

+) 예제코드

const number = 10;

// if문
if (number % 2 == 0) console.log("짝수");
else console.log("홀수");


// switch문
switch (number % 2){
	case 0:
		console.log("짝수");
		break;
	case 1:
		console.log("홀수");
		break;
}

---

📌 반복문

• for문
  • break ⏩ 반복문을 빠져나오게 한다.
  • continue ⏩ 현재 반복만 종료하고 다음 번 반복으로 넘어가게 한다.

for (초기식; 조건식; 증감식;) {
	실행될 코드
}

// 초기식과 증감식을 생략하는 방법
let i = 0;  // 1. 변수를 위에 선언하고 초기화한다.

for(; i <5; ){
	console.log(i++);  // 2. for문 블럭 안에 증감식을 넣는다.
}

 

• for of문
  : 반복이 가능한 객체(배열, 문자열)에서 사용할 수 있는 반복문으로, 주어진 객체를 차례대로 순회하면서 주어진 코드를 실행하는 방식

const arr = [1, 2, 3]

for (const i of arr) {
	console.log(i);
}
// result: 1 2 3 

 

• while문
  : 조건이 참일 동안 계속 반복하는 반복문

let i = 0;

while(i < 10){  // i<10를 만족하는 동안 반복이 계속 진행된다.
	console.log(i++);
}

 

• do while문
  • 조건문의 조건을 시작이 아닌 끝에서 판별한다.
  • while문과의 차이점: 무조건 한 번은 실행이 된다.

let i = 0;

do{
	console.log(i++);
} while(i < 10)  // 조건을 반복문 끝에 작성한다.

---

📌 함수

• 어떤 동작을 하기 위한 코드 집합을 의미한다.
• 반복적인 동작을 처리하기 위해 사용된다.

funtion bok(main){ // 인자를 넣는 공간 (비워둬도 된다)
	console.log(`${main} 볶음밥`);
}

bok('새우');
bok('제육');

funtion sum(a, b){  // 인자가 두 개일 경우
	console.log(a+b);
}

sum(10, 20);

 

• 인자: 함수를 호출할 때 전달하는 값 = 함수의 입력 값 = arguments
• 매개변수: 함수를 정의할 때 필요한 인자 = 함수의 입력 변수 = parameter
• 전역 변수(글로벌 변수): 함수 외부에서 선언된 변수, 함수 내부에서 접근하는 것이 가능하다.
• 로컬 변수: 내부에 선언된 변수
  +) 만약 외부와 내부에 이름이 같은 변수가 선언된다면? 함수는 내부에 있는 로컬 변수에만 접근할 수 있게 된다.

// const b = 10; -> 이렇게 밖으로 빼면 오류가 나지 않는다.

funtion a(){
	const b = 10; // b라는 변수는 함수 내부에서만 사용할 수 있다. 
	console.log(b);
}

a();  // result : 10
console.log(b);  // reference error

→ 위의 코드에서 error 가 나는 이유:

     변수를 사용할 수 있는 범위(scope)가 중괄호로 감싸진 블록 (block) 안으로 제한되기 때문
     (함수 뿐만 아니라 조건문, 반복문에서도 마찬가지)

 

• 함수 인자의 개수를 다르게 줘도 괜찮을까❓❓

funtion sum(a, b){  // 인자가 두 개일 경우
	console.log(a+b);
}

sum(10);  // 1. 인자의 개수를 다르게 주어도 어떠한 에러도 발생하지 않는다.
sum(10, 20, 30)  // 2. 오류가 나지 않고 30이라는 결과값이 나온다.

🎀 1번 예시의 결과

→ 이미 인자들은 undefined라는 디폴트 값을 가지고 있다. 즉, 인자를 하나만 전달해도 오류가 나지 않는다.
     sum(10)은 sum(10, undefined)와 같다고 할 수 있다.

     +) 디폴트 값을 부여할 수도 있다.  ⏩ sum(a, b = 0)

 

🎀 2번 예시의 결과

→ 인자를 초과해서 보내도 arguments 때문에 오류가 나지 않는다.

     ( arguments: 우리가 보낸 인자가 몇 개가 되었든 전부 받아서 배열처럼 저장, 접근할 수 있도록 만들어준다.)

 

• 나머지 매개변수(레스트 파라미터)
  : 지정한 인자를 제외한 나머지 모든 인자들을 배열로 묶어서 나타낼 수 있는 것

function print(a, b, ...rest){
		console.log(a);
		console.log(b);
}

print(10, 20, 30, 40, 50, 60, 70);
// result: 10, 20, [30, 40, 50, 60, 70]
// 나머지 값들을 rest라는 이름의 배열에 다 저장된다.

 

• return
  : 반환해주는 값

funtion sum(a, b){  
	return a + b;
}

console.log(sum(10, 20));

 

• 함수 표현식
  : js에서는 함수를 하나의 값으로 생각하기 때문에 함수를 변수에 값을 대입하듯이 표현식으로 작성할 수 있다.

function sum(a, b){
	console.log(a + b);
}

// 함수의 표현식
const sum = function (a, b){
	console.log(a + b);
}

sum(10, 20); // 함수의 표현식으로 해도 결과값은 똑같이 출력된다.

 

• 화살표 함수

const sum = (a, b) => console.log(a, b); 
// 코드가 한 줄이면 중괄호와 return(자동으로)을 생략할 수 있다.
// 그러나 중괄호가 있을 때는, return 값을 줘야한다.
// 인자가 하나면 소괄호를 생략해줘도 된다. 
// 인자가 없으면 소괄호를 생략할 수 없다.