S1 Unit2 - [JavaScript] 기초2

Chapter3. 함수란?

• 논리적인 일련의 작업을 하는 하나의 단위
• 작은 기능의 단위
• 구체적인 입력값과 출력값을 가질 수 있음

Chapter3-1. 함수의 이해

What does it mean?

• 코드의 묶음(즐겨찾기 버튼)
• 기능(function)의 단위
• 입력과 출력간의 매핑(mapping)
• 반드시 돌아온다(return)

How to Use

1. 버튼을 제작한다

• 선언(declaration)

function cal(param1, param2) {

    console. log (param1 + param2);

    return param1 * 10;

2. 버튼을 사용한다.

• 호출(call, invocation)

cal(10, 20);

함수를 표현한 표현식

let result = cal(10, 20); 

// 밑에 함수를 호출하면 리턴값으로 바뀜 -->let result = 100;


function cal(param1, param2) {

   console. log(param1 + param2);

   return param1 * 10;   //100

}

Chapter3-3. 함수 다루기

• 함수 내부에서 return 을 하지 않은경우는 출력값이 undefined이 된다.

함수 선언식

function getTriangleArea(base, height) {
  let triangleArea = (base * height) /  2;
  return triangleArea
}

함수 표현식

const getTriangleArea = function (base, height) {
  let triangleArea = (base * height) / 2;
  return triangleArea
}

화살표 함수

const getTriangleArea = (base, height) =>  {
  let triangleArea = (base * height) / 2;
  return triangleArea;
}

• 만약 함수의 본문(body)에 return문만 있는 경우
  → return과 {}중괄호(curly bracket)를 생략할 수 있음

const getTriangleArea = (base, height) => base * height / 2; //o,정상 작동
const getTriangleArea = (base, height) => {base * height / 2} // x, undefined 리턴

• return 문에서 소괄호를 사용할 수 있음

const getTriangleArea = (base, height) => (base * height / 2) // o, 정상 작동