Javascript
자바스크립트(8) 함수
DoosanBaek
2022. 8. 23. 21:24
자바스크립트 강의
개발일지
학습 진행 내용
함수
함수는 특정 작업을 수행하는 코드의 집합이라고 볼 수 있다.
코드를 통해서 이 함수라는게 왜 필요한 것인지 본다
const priceA = 1000
const priceB = 2000
// 두 상품가격의 합과 평균을 구해서 출력해야 하는 코드 작성
const sum1 = priceA + priceB
console.log(`두 상품의 합계는 ${sum1}이다.`)
const avg1 = sum1 / 2
console.log(`두 상품의 평균은 ${avg1}이다.`)
const priceC = 3000
const priceD = 4000
// 이번에도 두 상품가격의 평균을 구해서 출력해야 한다면? 위와 동일한 코드를 또 작성...
const sum2 = priceC + priceD
console.log(`두 상품의 합계는 ${sum2}이다.`)
const avg2 = sum2 / 2
console.log(`두 상품의 평균은 ${avg2}이다.`)
// 한두번은 괜찮은데 이렇게 수십, 수백번씩 평균을 구하고 출력해야 한다면?
이렇게 반복되는 특정 작업을 수행해야 한다면 그 코드 자체를 어딘가에 만들어서 저장해놓고 사용할 수 있지 않을까?
마치 변수에 데이터를 할당해놓고 계속 사용하는 것처럼.
바로 이 때 등장하는게 함수다.
함수의 선언과 호출
함수의 선언 변수를 선언하고 해당 변수에 값을 할당했던 것처럼,
함수도 선언을 하고 해당 함수가 실행할 코드의 집합을 만들어서 저장해준다.
function 함수명(매개변수들...) {
이 함수에서 실행할 코드들
return 반환값
}
여기서 함수명은 함수가 하는 일들을 대표할 수 있는 이름이면 좋다
매개변수(parameter) 는 해당 함수의 바디에 있는 코드에서 사용할 수 있는 일종의 변수이고, 함수 호출시 전달하게 된다. 함수를 실행하기 위해서 필요한 일종의 input 이라고 생각하면 된다.
중괄호 안에는 이 함수가 해야할 일들을 코드로 쭉 작성하고, 반환해야 할 값을 명시해 준다.
예시
// 함수의 선언
function calculateAvg(price1, price2) {
const sum = price1 + price2 // 매개변수인 price1, price2을 변수처럼 활용!
console.log(`두 상품의 합계는 ${sum}이다.`)
const avg = sum / 2
return avg // 평균가격을 리턴!
}
함수의 호출
함수를 선언만 하고 끝내면 안된다.
실제 이 함수를 사용하기 위해서는 호출을 해야 한다.
const 변수명 = 선언한 함수명(매개변수들...)
const priceA = 1000
const priceB = 2000
// 함수의 호출
const avg1 = calculateAvg(priceA, priceB)
console.log(`두 상품의 평균은 ${avg1}이다.`)
const priceC = 3000
const priceD = 4000
// 함수의 호출
const avg2 = calculateAvg(priceC, priceD)
console.log(`두 상품의 평균은 ${avg2}이다.`)
※함수 호출시 코드의 흐름
- 함수 calculateAvg를 호출하면서 변수 priceA와 priceB를 매개변수로 전달
- 함수 calculateAvg의 바디 코드가 실행됨. 이 때 1번에서 전달한 매개변수의 값이 함수를 선언할 때 썼던 매개변수명인 price1, price2에 할당되었다고 보면 됨
- 함수의 바디 코드가 최종적으로 변수 avg를 리턴하고 있고, 이것이 변수 avg1에 할당됨
연습) 세 개의 물건가격을 매개변수로 전달받아 평균값을 리턴하는 함수를 정의하고, 그 함수를 호출해서 평균값을 출력 해보기
function calculateAvg(price1, price2, price3) {
const avg = (price1 + price2 + price3) / 3
return avg
}
const priceA = 1000
const priceB = 2000
const priceC = 3000
const avg = calculateAvg(priceA, priceB, priceC)
console.log(`평균가격: ${avg}`)