[React] 함수를 선언합시다

함수란

특정 작업을 수행하는 코드 블럭.

✔️함수를 선언하고 실행하기

🔹기본 방법

// greet 이라는 함수이름을 주고 실행할 내용을 줌.
function greet() {
  console.log("Hello, World!"); 
}
// 선언된 함수를 호출하여 실행
greet(); // Hello, World!라고 출력됨.

🔹매개변수를 받아서 실행하기

// name이라는 매개변수를 받아서 사용
function greet(name){
	console.log("Hello, " + name + "!");
}
//선언된 함수에 Alice라는 값을 주면
greet("Alice"); //"Hello, Alice!" 출력

🔹리턴 값(값을 반환)

function add(a, b) {
  return a + b;
}
let result = add(3, 5);  // result에 8이 저장됨.

각 값들을 입력 후 출력 확인

1. 기본 함수 선언과 호출

function sayHello(){
	console.log("Hello, JavaScript!");
}
sayHello();

2. 매개변수를 사용하는 함수

function greetUser(name){
	console.log("Hello, " + name + "!");
}
greetUser("Ly-ra");

3. 리턴 값을 가지는 함수

function multiply(a, b){
	return a * b;
}
let result = multiply(3, 5);
console.log(result);

// 또는
function multiply(a, b){
	return a * b;
}
console.log(multiply(3, 5));

4. 여러 개의 매개변수를 사용하는 함수

function calculateRectangleArea(width, height){
	return width * height;
}
let area = calculateRectangleArea(5, 10);
console.log(`RectangleArea:${area}`);

5. 기본 매개변수 값

function greetWithDefault(name = "Guest"){
	console.log(`Hello, ${name}!`);
}
greetWithDefault();
greetWithDefault('Alice');

💡문제들을 풀어보면서 `${변수}`를 잠시 잊고 있었다. 5번 문제를 풀면서 왜 Default값이 받아지지 않을까..한참을 고민을 했었다. 이전 강의들을 조금 훑다보니 아하! 맞다! 하면서 해결 완료!