이번 포스팅에선
자바스크립트의 함수에 대해서 알아보고자 합니다.
● JavaScript 함수
덧셈을 하는 코드는 아래와 같습니다.
let a = 3;
let b = 5;
a+b ==> 8
그렇다면 덧셈을 여러 번 수행해야 할 때는
위와 같이 일일이 변수 선언하고 덧셈 연산을 써야 하냐..
그게 귀찮기에 함수가 탄생하였습니다.
○ 함수 선언
Ex) "hello"를 콘솔 창에 출력하는 함수 선언
// 작성법
function "함수이름"("매개변수") { "작성코드" }
function hello(){
console.log("hello!");
}
hello() ==> hello 출력
작성법에 의해서 만들고자 하는 함수를 선언하고,
함수 이름을 불러 언제든 호출할 수 있습니다.
● 매개변수가 있는 함수
예를 들어 두 수를 더하는 함수를 만드려고 합니다.
function add(){
console.log(2 + 5);
}
add() ==> 7 출력
위와 같이 함수를 작성했을 때 문제점이 있습니다.
2, 5의 덧셈이 아닌 다른 숫자로 연산을 하고자 할 때,
함수 안의 내용을 매번 바꿔줘야 하나??
이 문제점을 함수에 매개변수를 전달해줌으로써 해결할 수 있습니다.
○ 매개변수가 있는 함수 선언
Ex) 두 수를 더하는 함수를 작성
function add(a, b){
console.log(a + b);
}
add(3,4) ==> 7 출력
함수 선언문에 a, b 같은 매개변수를 전달하고
함수를 호출할 때 괄호 안에 매개 변숫값을 넣어주어 전달합니다.
문자열 예제를 한번 더 보면
Ex) 이름과 나이를 입력받아 출력하는 함수
function sayHello(name, age){
console.log("Hello My name is " + name +" and my age is " + age);
}
sayHello("lee", 20); => Hello My name is lee and my age is 20
● 계산기 프로그램
자바스크립트로 간단한 계산기 프로그램을 작성해봅시다.
function plus(a,b) {
console.log(a + b);
}
function divide(a,b) {
console.log(a / b);
}
function minus(a,b) {
console.log(a - b);
}
function mul(a,b) {
console.log(a * b);
}
plus(8 ,24); => 32
divide(8 ,24); => 0.33333333333
minus(8 ,24); => -16
mul(8 ,24); => 192
● Return (반환)
위의 예시들은 단순히 console.log() (콘솔 창에 출력)로만 사용했습니다.
그렇다면 단순 콘솔창 출력이 아닌
해당 함수에서 연산된(혹은 작성된) 결과를 활용할 수는 없을까..
그럴 때 return을 사용해주면 됩니다.
○ return 활용
Ex) 두 수를 더하는 함수를 작성
function add(a, b){
return a + b;
}
const add1 = add(3,4) ==> 반환된 7을 add1 변수에 저장(출력 아님)
const add2 = add(2,7) ==> 반환된 9을 add2 변수에 저장(출력 아님)
add(add1, add2) ==> 16값 반환
위와 같이 return을 통해
함수 안에서 도출된 결괏값을 반환할 수 있습니다.
