🥕 함수
- 함수 선언 :
function 함수이름() {명령}
- 함수 호출 :
함수이름()
- 이전에 배웠던
console.log()도 JS 개발자들이 미리 작성해둔 함수
- 복잡한 내용은 함수 내부로 숨기고, 핵심은 그 함수의 이름에 드러내는 것 -> 추상화
function greeting() {
console.log('Hi');
console.log('안녕');
console.log('こんにちは');
console.log('你好');
console.log('Guten Tag');
console.log('Bonjour');
console.log('Buongiorno');
};
greeting();
.
.
.
>>> Hi
안녕
こんにちは
你好
Guten Tag
Bonjour
Buongiorno
1. 매개변수 (Parameter)
- 함수를 호출할 때, 소괄호 안에 입력하는 값
= 함수에 전달되는 변수
function greeting(sentence) {
console.log(sentence);
};
greeting('Hola');
.
.
.
>>> Hola
function welcome(name) {
console.log('안녕하세요 ' + name + '님!');
};
welcome('소샤이');
.
.
.
>>> 안녕하세요 소샤이님!
function printSquare(x) {
console.log(x * x);
};
printSquare(2);
printSquare(5);
printSquare(6);
.
.
.
>>> 4
25
36
2. 여러 개의 parameter
function 함수이름(parameter1, parameter2) {}
function printSum(num1, num2) {
console.log(num1 + num2);
};
printSum(10, 5);
printSum(123, 4);
printSum(56, 7890);
.
.
.
>>> 15
127
7946
function introduce(name, birth, nationality, job) {
console.log('안녕하세요! 반갑습니다.');
console.log('제 이름은 ' + name + ' 입니다.');
console.log('생년월일은 ' + birth + ' 이고,');
console.log('국적은 ' + nationality + ' 입니다.');
console.log('직업은 ' + job + ' 입니다.');
console.log('잘 부탁드립니다!');
};
introduce('소샤이', '21.04.10', '한국', '토깽이');
.
.
.
>>> 안녕하세요! 반갑습니다.
제 이름은 소샤이 입니다.
생년월일은 21.04.10 이고,
국적은 한국 입니다.
직업은 토깽이 입니다.
잘 부탁드립니다!
3. Optional Parameter
- parameter에 기본값을 설정
- 함수를 호출할 때, parameter 값을 생략하면 기본값으로 출력
- 선언할 때, 가장 뒤 쪽 순서로 선언하기
function introduce(name, age, nationality = '한국') {
console.log(`제 이름은 ${name}입니다.`);
console.log(`나이는 ${age}살이고,`);
console.log(`국적은 ${nationality}입니다.`);
};
introduce('소샤이', 1, '미국');
console.log('');
introduce('소샤이', 1);
.
.
.
>>> 제 이름은 소샤이입니다.
나이는 1살이고,
국적은 미국입니다.
제 이름은 소샤이입니다.
나이는 1살이고,
국적은 한국입니다.
🥕 return문
- return : 함수의 아웃풋
- 되돌려주는 값을
반환값 혹은 리턴값이라고 부름.
function getTwo() {
return 2;
};
console.log(getTwo());
.
.
.
>>> 2
function getTwice(number) {
return number * 2;
};
console.log(getTwice(5));
.
.
.
>>> 10
function getTwice(number) {
return number * 2;
};
let x = getTwice(5);
let y = getTwice(2);
console.log(x * y);
.
.
.
>>> 40
1. return문 심화
- 결과값을 돌려주는 역할 이외에도, 함수의 실행을 중단시키는 역할이 있음.
- 함수 내부에서
return 키워드가 나오면, 함수의 실행은 그 지점에서 중단됨.
- return 키워드 이후에 작성된 코드를 dead code라고 함.
function square(x) {
console.log('return 전');
return x * x;
console.log('return 후');
};
console.log('함수 호출 전');
console.log(square(3));
console.log('함수 호출 후');
.
.
.
>>> 함수 호출 전
return 전
9
함수 호출 후
2. return과 console.log의 차이
- 함수를 선언할 때, return문을 따로 작성하지 않으면,
console.log()로 출력 시, undefined 값을 return
function printSquare(x) {
console.log(x * x);
};
function getSquare(x) {
return x * x
};
printSquare(3);
getSquare(3);
console.log(getSquare(3));
console.log(printSquare(3));
.
.
.
>>> 9
9
undefined