이번 글은 연습문제 풀이입니다. 이전 글에서 연습문제를 풀어 보신 분들만 아래 내용을 확인하시길 바랍니다.











풀이

function supplementaryClass(koreanScore, englishScore, mathScore){ var average = (koreanScore + englishScore + mathScore)/3; if(average <= 50){ console.log("보충수업 대상자입니다"); } }

혹은,

function supplementaryClass(koreanScore, englishScore, mathScore){
  if((koreanScore + englishScore + mathScore)/3 <= 50){
    console.log("보충수업 대상자입니다");
  }
}

물론 위 함수에서 사용된 함수명(supplementaryClass), 파라메터 이름들(koreanScore, englishScore, mathScore)이 달라도 상관없습니다. 어떻게 함수를 구성했든 세가지 값을 받아 평균을 구하고 평균의 값이 50이거나 작을 때 "보충수업 대상자입니다"라는 문자열을 출력하면 정답입니다.

위 함수를 만들 때 "보충수업", "국어 점수", "영어 점수" 등을 어떻게 함수명, 파라메터명으로 표현해야할지 고민이셨다면.. 개발자의 고충을 한발 더 이해하게 된 것입니다. 실제로 프로그래머들은 변수명, 함수명을 정하는데 많은 고민을 합니다.

지금까지 배운 내용을 바탕으로 코딩 연습을 해봅시다.

연습문제 8-1 보충수업 함수1

한 학교에서 국어, 영어, 수학 평균 점수가 50점 이하인 학생들을 대상으로 보충수업을 진행합니다. 보충수업 대상자인지 아닌지를 판별할 수 있는 함수를 만들어 보세요.

  • 함수는 국어, 영어, 수학 점수 3가지의 값을 입력받습니다. 점수는 숫자입니다.
  • 입력받은 세 점수의 평균 점수가 50점 이하라면 보충수업 대상자입니다.
  • 수학 보충수업 대상자라면 함수는 "보충수업 대상자입니다"라는 문자열을 콘솔에 출력하고, 아니라면 아무런 값을 출력하지 않습니다.

위 조건을 만족하는 함수를 만들고, 테스트를 통해 제대로 작동하는지 확인해 보세요.

연습문제 풀이는 다음 글에 있습니다. 반드시 연습문제를 푼 다음 해답을 확인하시고, 만약 잘 모르는 부분이 있다면 댓글을 남겨주세요. 답변해 드리겠습니다.

조건문(Conditional Statement)

조건문(Conditional Statement)은 조건에 따라 다른 코드를 실행할 수 있게하여 프로그램에 분기를 주는 있는 프로그래밍 문법입니다. 이번 글에서는 조건문 중 하나인 if else문을 공부해 보겠습니다.

if else 문

if else 문의 구조를 살펴봅시다.

if(조건){ 조건을 만족하는 경우 이곳의 코드가 실행됨 } else { 조건을 만족하지 못하는 경우 이곳의 코드가 실행됨 }

- 만약(if) 조건이 참이라면 조건이 참일 경우 할 일 코드를 실행하고, 조건이 거짓이라면(참이 아니라면(else)) 조건에 맞지 않을 경우 할 일 코드를 실행합니다. 여기서 if와 else는 예약어입니다.

- else { ... } 부분은 생략될 수 있으며, else 부분이 없으면 조건에 맞지 않을 경우 아무일도 하지 않고 다음 코드로 진행합니다.

위 구조를 완전히 이해하려면 조건이 참, 조건이 거짓이라는 것이 무슨 뜻인지 알아야 겠죠. 프로그래밍에서 참과 거짓은 Boolean 타입(자료형)의 데이터입니다.

불리언(Boolean) 타입

Boolean에 해당하는 데이터는 참(true)과 거짓(false) 단 두가지 뿐이며 참은 true로 나타내며 거짓은 false로 나타냅니다. 이들은 데이터이므로 당연히 변수에 넣을 수도 있고, 연산을 통해 얻을 수도 있습니다. true와 false는 예약어입니다.

브라우저 콘솔을 열고(콘솔 여는 법 링크) 아래의 코드를 실행해 봅시다.

function trueOrFalse(value){
  if(value){ 
    console.log("참입니다"); 
  } 
  else { 
    console.log("거짓입니다"); 
  }
}

var condition1 = true;
var condition2 = false;

trueOrFalse(condition1);
trueOrFalse(condition2);

trueOrFalse함수에 true가 대입된 condition1을 넣어 호출하면 if else 문에 의해 "참입니다"가 콘솔에 출력되고, false가 대입된 condition2를 넣어 호출하면 if else문에 의해 "거짓입니다"가 출력됩니다.

이 예제에서는 참(true)과 거짓(false)를 변수에 넣어 직접 전달해 주었지만, 비교연산자를 통해 true나 false를 생성할 수도 있습니다.

비교연산자

좌항과 우항을 비교하여 그 값들에 따라 Boolean 타입 true 혹은 false를 생성하는 연산자들을 비교연산자라고 합니다.

 비교연산자  의미  예제  결과
 ==  좌항과 우항이 같음  1 == 1  true
 !=  좌항과 우항이 같지 않음  1 != 1  false
 > 좌향이 우항보다 큼 1 > 2  false
 < 촤항이 우항보다 작음 1 < 2  true
 >= 좌항이 우항보다 크거나 같음  1 >= 1 true
 <=  우항이 좌항보다 크거나 같음 1 <= 1 true

if else 문과 비교연산자를 이용하여 '나이'를 입력받아 성년자인지 미성년자인지를 알려주는 함수를 만들어 봅시다.

function isAdultOrNot(age){
  if(age>=19){
    console.log("성인입니다"); 
  } 
  else { 
    console.log("미성년자입니다"); 
  }
}

isAdultOrNot(13), isAdultOrNot(40) 등의 값을 입력해 보고 값을 확인해 봅시다.

정리 및 요약

  • 조건문(Conditional Statement): 프로그램 코드가 조건에 따라 다른 코드를 실행할 수 있게 프로그램에 분기를 줄 수 있는 프로그래밍 문법
  • if else 문:
    if(조건){
      조건이 참(true)인 경우 이곳의 코드가 실행됨
    }
    else {
      조건이 거짓(false)인 경우 이곳의 코드가 실행됨
    }
    if, else는 예약어
  • 불리언(Boolean): 참(true)과 거짓(false)을 표현하는 데이터 타입(자료형). true. false은 예약어
  • 비교연산자: 좌항과 우항을 비교하여 그 값들에 따라 true 혹은 false를 생성하는 연산자
  •  비교연산자  의미
     ==  좌항과 우항이 같음
     !=  좌항과 우항이 같지 않음
     >  좌향이 우항보다 큼
     <  촤항이 우항보다 작음
     >=  좌항이 우항보다 크거나 같음
     <=  우항이 좌항보다 크거나 같음


함수(Function)

프로그래밍에서 함수는 수학시간에 배우는 함수와 비슷합니다.

들어가는 값이 2가 곱해지고 4가 더해진 후 나오는 함수를 나타낸 그림으로, 수식으로 표현하면 2x+8=y(x가 들어가는 값, y가 나오는 값)가 됩니다. 들어가는 수와 결과값은 달라질 수 있지만 그 과정은 항상 일정하죠.

마찬가지로 프로그래밍에서의 함수도 같은 과정을 반복 수행하기 위한 용도로 사용됩니다. 반복적으로 사용되는 코드를 함수로 만든 후, 해당 과정이 필요할 때 함수를 호출하면 같은 코드를 여러번 작성 할 필요도 없고, 변수처럼 함수도 이름을 지어 줄 수 있으므로 해당 함수가 무슨 일을 하는지 나타내기가 쉬워 코드의 가독성을 높일 수도 있습니다.

함수의 선언

function 함수_이름(입력값_이름, 입력값2_이름){
  함수_내용
  return 출력값;
}

의 형식으로 자바스크립트 함수를 만들 수 있습니다.

- function은 함수의 선언을 나타내는 예약어입니다.
- 함수 이름을 짓는 규칙은 변수 이름을 짓는 규칙과 같습니다.
- 함수 이름 뒤 ()에 입력값 이름들을 나열합니다. 입력값 이름을 짓는 규칙 역시 변수 이름을 짓는 규칙과 같습니다.
- 입력값 이름은 해당 위치에 입력된 값을 함수 내용안에서 사용하기 위해 사용됩니다.
- 입력값은 파라메터(parameter) 혹은 함수 인자로 불립니다.
- 함수의 파라메터는 없을 수도 있고, 하나일 수도 있고 여러개일 수도 있습니다.
- 대괄호{ }안에 함수 실행시 할 일을 코드로 작성합니다.
- return은 함수를 종료하고 함수가 어떤 값을 출력할지를 나타내는 예약어입니다.
- return은 없을 수도 있습니다. 이 경우 함수는 항상 { }안의 코드를 모두 실행하고 undefined를 return하게 됩니다. 이 부분은 뒤에 다시 설명하겠습니다.

처음에 본 그림의 수식을 함수로 작성해 봅시다.

function myFunction(x){ var y = x*2+8; return y; }

첫번째 줄을 보면

- 함수의 이름은 myFunction이고,
- 1개의 값을 입력받으며,
- 그 입력값은 x라는 이름으로 함수 코드에서 사용되는 것

을 알 수 있습니다.

{}안의 함수 내용을 살펴봅시다. 입력된 값 x에 2를 곱하고 8을 더해 y라는 변수에 저장하고, 이 y를 최종적으로 return합니다.

웹브라우저 콘솔을 열고(콘솔 여는 법 링크) 위 코드를 입력하여 함수를 만들어 봅시다.

이 함수는 내용이 간단하기 때문에 함수의 필요성을 잘 못느낄 수도 있지만, 함수가 없는 프로그램은 존재하지 않을 정도로 함수는 프로그램의 기본이며 굉장히 중요합니다.

함수의 호출

함수_이름(입력값, 입력값2);

의 형식으로 함수를 실행할 수 있습니다. 함수의 실행은 미리 저장된 코드를 불러오는 것이므로 '함수를 호출한다'고 표현합니다.

위에서 만든 myFunction함수에 12라는 값을 넣어 함수를 호출해 봅시다.

함수안의 코드가 실행되어 32가 출력되었습니다.

출력값(return)이 없는 함수

수학의 함수를 생각하면 출력값이 없는 함수는 필요 없을 것같지만, 프로그래밍의 함수는 지정된 코드의 반복이라는 점에서 출력값이 없어도 의미가 있습니다.

아래 함수를 살펴봅시다.

function greeting(name){
  console.log("Hello "+name);
}

이 함수는 실행을 하면 아무런 값을 return하지 않지만 콘솔에 문자를 출력하는 작업을 합니다.

+ 연산자는 숫자 사이에 사용되면 수학적 덧셈을 하지만, 문자열 사이에 사용되면 두개의 문자열을 하나로 합쳐 하나의 문자열로 만들어 줍니다.

정리 및 요약

  • 함수(Function): 같은 코드을 반복 수행하기 위한 용도로 사용. 코드의 반복을 줄이고 함수 이름을 통해 가독성을 높일 수 있음
  • function은 함수의 선언을 나타내는 예약어
  • 파라메터(parameter), 함수 인자: 함수에 전달 되는 값을 뜻함
  • 함수 이름, 파라메터 이름을 짓는 규칙은 변수 이름을 짓는 규칙과 같음
  • return: 함수를 종료하고 함수가 어떤 값을 출력할지를 나타내는 예약어
  • 함수에서 return은 없을 수도 있음. 이 경우 함수는 항상 undefined를 return
  • 함수의 실행은 미리 저장된 코드를 불러오는 것이므로 '함수를 호출한다'고 표현
  • + 연산자는 숫자 사이에 사용되면 수학적 덧셈을 하지만, 문자열 사이에 사용되면 두개의 문자열을 하나로 합쳐 하나의 문자열로 만듦


+ Recent posts