Wecode- Pre-course (부트캠프)

프리코스 (7) - Javascript : 4.함수 (1) 정의, 호출

Queen Julia 2023. 9. 26. 15:16

4. 함수 (1) :  정의, 호출 

 

요즘은 함수 잘해야 함. 

와 진짜 replit다 풀어오라는데 한명도 10명 이상 안함? 

 

function alertSuccess(month, name) {

  alert(month + "월의 당첨자는 " + name + "입니다.");

}

 

alertSuccess(3, "김개발");


함수 내부에서 다른 함수 호출하기

function getTax(price) {

 return price * 0.1;

}

 

function calculateTotal(price) {

 return price + getTax(price);

}

 

→ price를 변수로, calculateTotal 함수 내부에서 getTax를 또 호출했습니다. 함수가 실행되는 시점은 함수를 호출하는 순간

 


함수의 기본적인 정의 및 실행

아래는 alertSuccess 이름을 가진 함수의 정의입니다. 로그인이 잘 됐으면, "로그인 성공!" 이라는 alert를 띄우는 함수입니다.

 

function alertSuccess() {

 alert("로그인 성공!");

}

함수는 정의했지만, alert는 실행되지 않습니다. 

함수 내부(body)는 함수를 호출하기 전까지는 실행되지 않기 때문입니다. 

함수 내부의 로직을 실행하기 위해서는 함수의 이름과 () 소괄호를 사용하여 함수를 호출해야 합니다.

alertSuccess();

비로소 alert 창이 나타납니다. 여기까지는 앞서 다뤘던 내용



함수를 선언하는 방법은 2가지 

아래를 더 많이 씀 

 


4-1. 함수의 선언과 실행

  • 함수(Function)란 특정한 작업을 수행하도록 설계된 독립적인 코드 블록
  • {     }  이게 함수 
  • 장점: 미리 만들어놓고 쓰고 싶을 때마다 쓸 수 
  • 주의: 함수 만들어놓고, 함수 호출해야만 나온다

 

  • Input → Function (내부적으로 기능 수행) → output 도출 

         ex. 과일 →자르는 것 (칼로) → 잘린 과일 

 

        Ex. ‘Code Kim’ → saying hello to friends → ‘Hello, Code Kim!’ 

               친구에게 인사하라는 기능을 수행하기 위해서는, 친구가 필요함 (input 주기) 

              1. Input 받기 

             2. 기능 수행

             3. output 반환

 

         → 그런데 이렇게 3개가 늘 있어야 하는 건 아님. (Input, output 중 한개,  둘다 없어도 함수 동작 가능) 

 

  •    함수를 선언하면 실행을 해야 한다 = 함수를 정의하고 호출한다 = 함수를 만들고 동작시킨다

 

 

1. function 명령어로 함수 붙인다  = 정의

    function.sayHello (  ) {        

 

2. 함수에 이름 붙인다

    function.sayHello (  ) {            (   ) 가 input 

 

3. { } 내부에 동작할 기능 

function.sayHello (  ) {     } 

 

function.sayHello (  )console.log(‘hello’)    } 

함수를 선언/정의만 한 것. 그래서 아무 변화 없음. 

   호출하지 않으면 동작을 하지 않아서 아무 값도 안 나옴

 

함수를 실행시켜줘야 함 (심부름처럼 함수를 호출/실행해야 함)

function.sayHello (  ) { console.log(‘hello’)     }        →  input값없이 실행하는 케이스 

sayHello( ) 

→ Hello 



function.sayMyName (  ) { console.log(‘김코드’)     } 

                  sayMyName( )     → 호출

→ 김코드


function welcome() {

let greeting = "환영합니다";

return greeting; 

}

 

  • 함수를 정의할 때는 function 키워드로 시작합니다.
  • 함수 이름을 지어줍니다. (welcome)
  • 소괄호 ( ) 를 열고 닫습니다.
  • 함수의 시작을 알리는 중괄호{ }을 열어줍니다.
  • 함수에서 실행할 코드(함수 실행 단위)를 중괄호 사이( {...} )에 작성합니다. 함수의 body 라고 부르기도 합니다. 가독성을 위해 들여쓰기가 되어있습니다.
  • 반환 할 값을 return문에 작성합니다.
  • 함수의 끝을 알리는 중괄호{ }로 닫아줍니다.

 


4-2. 여러 개의 인자를 받는 함수 

function addNums(num1, num2) {

return num1 + num2; 

}


Replit 문제 풀이 

오답노트:

 함수 선언/생성/ 만든 뒤에, 호출을 해줘야 함

 

function checkCorrect() {

 const hi = "안녕하세요";

  return hi;

}

      - checkCorrect라는 이름의 함수를 생성했습니다.

 

     -  생성한 함수를 다음과 같이 호출할 수 있습니다.

           checkCorrect();

     -   함수를 정의만 하고 호출하지 않으면 실행되지 않으니 꼭 유의해주세요!



함수를 선언/만들어줬으면 꼭 함수 실행/호출 해줘야 하고,

함수를 호출만 하고 선언하지 않으면 함수 호출/실행 안 됨. 

ex. add 함수 실행(호출)

      add();

  • add 함수를 호출하기 전까지는, sum 변수가 생성되지도 않고, 3+3 더하기도 되지 않습니다.
  • 함수 내부가 실행되려면 위와 같이 함수를 호출해야합니다.
  • 함수를 호출하는 시점이 바로 add 함수가 실행되는 시점입니다. 따라서 3+3 더하기 연산이 실행되고 sum 변수에 저장되는 시점은 add() 함수가 호출되는 시점입니다.
  • 함수를 호출하는 형태는 아래와 같이 함수 이름에 괄호()를 여닫아주면 됩니다.