이다닷

[JavaScript] Day 15 - 함수에 대하여 본문

카테고리 없음

[JavaScript] Day 15 - 함수에 대하여

이다닷 2023. 2. 14. 15:20

함수

함수란 '호출될 수 있는 코드 조각'이다.

변수를 선언하고 데이터를 대입하면 변수의 이름을 데이터 대신 사용할 수 있는 것처럼,

함수를 선언하면 함수의 이름을 코드 조각 대신 사용할 수 있다.

 

📌변수와 비슷한 정의로 데이터 대신  코드에 이름을 붙여주는 것!

 

함수 선언식

function 함수명() {

    // 함수의 기능을 표현한 구문

}

=> 위와 같은 선언 이후, 함수명은 중괄호 안의 기능 대신 사용될 수 있다!

 

함수 표현식

const 함수명 = function() {

    // 함수의 기능을 표현한 구문

}

=> 마찬가지로 선언이후, 함수명은 중괄호 안의 기능 대신 사용될 수 있다!

 

함수 사용

함수를 만들고 나면 함수를 사용해야 한다. 

위의 두가지 방식으로 함수를 만들고, 함수를 사용하기 위해서는 함수를 '호출'해야만 한다!!

=> 함수를 호출할 때에는 함수의 이름 뒤에 반드시 소괄호를 붙여줘야 합니다!

    ex) sayHello()   // 함수 호출문

 

데이터 반환

함수를 만들 때, 함수가 데이터를 반환하도록 할 수 있다.

함수가 데이터를 반환한다는 것은, 함수 호출문이 데이터로 대체됨을 뜻한다!

 

함수가 데이터를 반환하려면, '데이터를 반환한다'라는 구문을 함수 내부에 추가해주어야 한다.

이때 키워드 return이 사용된다.

    ex) return 3;

 

키워드 return에 대하여

return은 함수 내부에서 함수의 부가 기능을 위해 사용하는 키워드이다.

return은 두 가지 기능을 가지고 있다.

  • 함수로부터 데이터를 반환한다.
  • 함수를 끝낸다.

return은 뒤에 붙은 데이터를 반환한다.

📌이때 데이터는 딱 하나씩만 반환할 수 있다.

 

함수의 소괄호?!?

함수 호출문은 '함수명 + 소괄호'이다.

소괄호의 역할은 함수가 실행될 때 사용할 재료를 전달받는 것이다.

여기서 재료란 데이터를 뜻한다.

 

여기서 함수가 사용하는 재료를 '매개변수'고 한다.

    ex) FunC( 여기 )

 

매개변수는 원하는 만큼 추가할 수 있다.

구분자 쉼표(,)를 이용해 추가하고, 호출 시에도 그에 맞게 재료를 전달한다.

    ex) sayFood( food1, foo2 )

 

우리가 만들 수 있는 함수

  • 매개변수도, 반환도 없는 함수
  • 매개변수는 있지만, 반환은 없는 함수
  • 매개변수는 없지만, 반환은 있는 함수
  • 매개변수와 반환이 모두 있는 함수

 

 

오늘의 실습 1

function sayHello(){     // 함수 선언식
    console.log("Hello")
}
// 아래에 함수 호출문이 없어서 실행되지 않음

const sayBye = function(){   //함수 표현식
    console.log("good bye~")
}

sayBye()

실습의 결과 1

오늘의 실습 2

function thereIsReturn(){
    console.log("반환한다.")
    let num = 5;
    return num
    console.log("나올까?")  // return으로 함수가 종료되었기때문에 출력되지 않는다.
}

const result = thereIsReturn()
console.log(result)

실습의 결과 2

오늘의 실습 3 

function oddEven(number){
    if(number % 2 == 1){
        return "홀수"
    }
    else{
        return "짝수"
    }
}

console.log(oddEven(10))
console.log(oddEven(7))

실습의 결과 3