D+2_2 / [JavaScript] 기초 - 함수

* 함수(function)

: 코드의 묶음(즐겨찾기), 기능의 단위, 입력과 출력산의 매핑, 반드시 돌아온다 / 어떤 목적을 가진 작업들을 수행하는 코드들이 모인 블록, 함수는 항상 출력값을 반환한다!(return)-만약 return문을 사용하지않으면 undefined을 반환한다

• 선언
• 호출 : 함수의 이름을 적은 후 괄호를 열고 지정된 인수들을 채워넣은 후 괄호를 닫는 것으로 함수를 호출할 수 있다.
• 함수를 포함한 표현식이 어떻게 평가되는지 알아보자.
  ex) 삼각형의 넓이를 구해야 하는 경우

   const base = 3;
    const height = 4;
    const triangle = (base * height) / 2;
    console.log(triangle); // 결과 : 6 
   인데... 변의 길이가 바뀌는 경우 함수로 만들어 계산할수 있음
    function getTriangle(base, height) {
      let triangle = (base * height) / 2;
      return triangle;
    }
    console.log(getTriangle(2,4)); // 4 
   이렇게 함수로 할수 있음

• 함수 선언 방법
  • 함수 선언식

    function getTriangle(base, height) {
      let triangle = (base * height) / 2;
      return triangle;
    }

  • 함수 표현식 (할당 전에 사용할 수 없다.)

    const getTriangle = function (base, height) {  // 먼저 변수를 선언하고 익명함수를 할당하는 방식
      let triangle = (base * height) / 2;
      return triangle
    }

  • 화살표 함수(ES6문법으로 새로 도입)

    const getTriangle = (base, height) => {  // 함수 표현식을 기반으로 하여 먼저 변수 선언하고 function키워드를 화살표로 축약해서 표시한 익명합수를 할당하는 방식 
      let triangle = (base * height) / 2;
      return triangle;
    }

  - 만약 함수의 본문(body)에 return 문만 있는경우, return과 {}중괄호(curly bracket)를 생략할 수 있음.
   const getTriangle = (base, height) => height / 2;  // O, 정상작동 ( 중괄호 생략해야만 함)
   const getTriangle = (base, height) => { height / 2 }  // X, undefined 리턴
   const getTriangle = (base, height) => () height / 2 )  // O, 정상작동 - 소괄호 사용 가능
  - 함수 내의 표현식이 2줄 이상인 경우, return과 {}중괄호를 명시적으로 쓰는 것이 좋음
   const getStudent = arr => arr.filter(person => person.job === 'student').reduce((sum, person) => (sum + person.grade), 0) // bad...
   const getStudent = arr => {
     return arr
     .filter(person => person.job === 'student')
     .reduce((sum, person) => (sum + person.grade), 0)
   }  // good!! 

• 파라미터(parameter)와 인자(argument) 차이점
  function getTriangle(base, height) { // base, height -> 매개변수(parameter) : 함수 실행시 입력에 따라 바뀔수 있는 변수지만 let등을 안써도 됨
  let triangle = (base * height) / 2;
  return triangle;
  }
  getTriangle(2,4); // 3,4 -> 전달인자(argument) : 함수의 변수에 집어넣는 값 = 함수를 호출할때 전달해 주는 값 = 매게변수에 할당 되는값

  프로그래머 끼리 대화할때는 파라미터든, 아규먼트든 그냥 '입력값' 이라고 말하기도 한단댜~!~
  파라미터는 함수 내부에서 변수 선언을 따로 하지 않아도 되는지..? --> 이미 함수내부에서만!! 변수로 선언이 된거기 떄문!!, 전달인자가 전달되면 변수로 할당된거

• 생성자 함수 ex) Number('123') -> 숫자로 평가될 수 있는 값을 모두 숫자로 바꾸어 리턴,, Number('안녕')은 NaN을 리턴 --- Number(NaN)은 number로 리턴..ㄷㄷ
  String(12) -> 모두 문자열로 바꾸어 리턴, 결과 : '12'