TIL/JavaScript

JavaScript - 함수

han1693516 2022. 5. 8. 19:22

함수 선언
   function sum(a,b){   - sum:함수 이름
        return a+b;       - a,b:매개변수
}

sum(2,3)                  -2,3 : 인자
함수 호출을 위해서는 함수 이름 + 괄호를 넣어서 호출해야

   cf>함수는 primitive value가 아닌, 객체와 같이 취급
            ->call by reference : (객체, 함수, 배열 등이 이런 방식)
                    위 함수를 예로 들면 sum이라는 변수가 할당된 공간과, 블록 내 코드가 할당된 공간 두 개를 받음.
                    sum 관련 공간에는 블록 내 코드로 갈 수 있는 reference(주소)가 저장됨 

                     cf> const doSomething = sum;이 들어간다면?
                               ->doSomething 변수가 할당된 공간에 sum이 가리키고 있는 reference가 저장됨

             ->primitive data type는 call by value(number, string, boolean, undefined, null)
                   변수에 할당된 메모리에 주소가 아닌 
                   변수의 값이 그대로 저장되는 방식
   

  cf> 매개변수가 없는 함수의 괄호에 input을 넣어도 함수의 출력은 달라지지 않음
             예) function print(){
                     console.log("hello");
                 }
                 print(2,3) -> hello

cf> 함수는 하나의 일만 하도록 해야 , 함수의 이름은 동사(ex>doSomething)
      함수의 이름을 만들기 어렵다면, 함수가 한 번에 여러 일을 하는 것이 아닌지 확인


callback function
     - 함수 안에 있는 함수
     - 예) function surprise(operator){
                const result=operator(2,3); 
                return result;
 }

surprise(sum); //여기서는 매개변수 취급된 sum 함수가 callback function

규모 있는 프로젝트, 다양한 개발자와 일하거나, 작성한 코드를 library 형태로 api 제공할 때
typescript를 쓰는 것이 코드를 명시적으로 만들어줌


default parameter(es6)
   - function showMessage(message, from = 'unknown' ->from 기본값을 unknown으로 설정){
             console.log(`${message} by ${from}`)
}


rest parameter(es6)
    -function printAll(...args){  //...args ==배열 args[i] 선언
        for(let i=0;i<args.length;i++)
         {
             console.log(args[i]);
         }
      }

    printAll('dream', 'coding', 'ellie'); //배열 args[i]에 인자 3개 추가

   cf>const arg of args
           - 변수 arg에 배열 args의 값 하나씩 넣기
           -> for(const arg of args){
                  console.log(arg); //
                }
   
 모든 함수에는 return undefined가 들어 있음(생략 가능)

early return ; early exit
   조건이 맞지 않으면 return을 넣어 함수를 일찍 종료시켜야

함수 표현식(호이스팅 X, 함수 선언문은 호이스팅 발생함)
    - function sum(a,b){           let sum=function (a,b)=>a+b;
            return a+b;        ==   sum(1,2) //이름이 있는 함수 - named function //debugging에 유리                                    
        }                                                 이름없는 함수 - anonymous function
       sum(1,2)

callback hell
     - 예시)function randomQuiz(answer, printYes, printNo){
                    if(answer==='love you'){
                          printYes() //
                      }
                     else{
                          printNo();
                     }
                          }

  arrow function(always annoymous - 익명 함수여야 함)
       - const sum=function(a,b){
              return a+b;
         }

        const sum=(a,b) => a+b;
        cf> 두 줄 이상인 경우 {} 사용, return문도 넣어야

 iife(immediately invoked function expression)
    - 함수 선언과 호출을 동시에 
    - 함수 선언문을 괄호로 감싸고, 옆에서 매개변수 포함된 괄호 넣기
    - 최근에는 잘 쓰이지 않음
    - (function hello(){ console.log('hello');})();
                

'TIL > JavaScript' 카테고리의 다른 글

Class  (0) 2022.07.15
배열 관련 함수  (0) 2022.05.22
배열(기초)  (0) 2022.05.21
객체(object)  (0) 2022.05.21
JavaScript - 조건문, 반복문, 형변환  (0) 2022.05.08