함수(Function)

summerlee·2022년 9월 12일

TIL

목록 보기

6/39

함수란?

코드의 재사용 가능한 일부로서 언제든 사용할 수 있도록 이름을 붙여놓은 것
코드의 중복을 줄이는데 무척 유용함
코드를 더 읽기 쉽고 이해하기 쉽게 함

function funcName() { 	// function 정의할 함수의 이름
	// 실행할 동작(함수를 실행할 때까지 동작하지 않는다.
}
funcName();	// 함수 실행

함수의 구조

누군가 input 을 주면 함수가 내부적으로 특정한 기능을 수행해서 기능의 결과물로 output을 도출

input 받기
기능 수행
output 반환

함수는 꼭 선언 후 실행을 해줘야 한다. 선언만하고 실행하지 않으면 아무런 작동도 하지 않는다.

인수 (argument) = Input

함수에 입력하는 값
전달하는 입력 값

Input & Output 없이 기능 수행만 하는 함수

function sayHello() {   
  						
	console.log('안녕하세요, 홍길동님'); // 동작 할 기능
}

sayHello()

Output 이 있는 함수 (Output 반환 = Output Return)

function sayHello2() {
  let friend = '홍길동'
  return '안녕하세요 ' + friend // return 명령어 사용해서 ouput으로 내고싶은 대상을 명시
}

sayHello2()

하지만 이렇게 한다고 해서 console.log 에 결과물이 나오는 것은 아니다.
왜냐하면 return 을 한다고 해서, 결과물이 바로 눈에 보인다는 뜻이 아니기 때문이다.
눈에 보이는 것은 console.log 가 유일하다.
그렇다면 어떻게 해야 결과물이 눈에 보일까?
console.log 에 함수명을 넣고 찍으면 된다.

function sayHello2() {
  let friend = '홍길동'
  return '안녕하세요 ' + friend
}

console.log(sayHello2()); // sayHello2() 를 실행해서 나오는 ouput을 콘솔로그로 찍겠다는 뜻

그럼 콘솔에 찍히지도 않는데 Return 을 대체 왜? 사용하는걸까?

return 한 값을 변수에 할당 가능 하기 때문이다.
function sayHello2() {
  let friend = '홍길동'
  return '안녕하세요 ' + friend
}
let myFriend = sayHello2(); // myFriend 라는 변수에 sayHello2() 함수 값 할당
console.log(myFriend);
// ---> 결과: 안녕하세요 홍길동

Return 과 Console.log 의 차이점

1. Return

함수의 Output

반환하는 결과물

변수에 할당 가능

2. Console.log

단순히 화면에 출력

변수에 할당 불가능

Input (매개변수 / Parameter)

function sayHello() {   // sayHello(input) -> input의 자리!
  						// 함수 선언(정의)
  
	console.log('안녕하세요, 홍길동님'); // 동작 할 기능
}

sayHello() // 함수 실행(호출)

매개변수는 외부로부터 들어오는 값을 담아 함수 내부에서 사용하도록 하는 변수의 역할을 한다.
매개변수란 함수 외부로부터 들어온 값이 담길 자리이다.
매개변수의 이름은 원하는대로 지을 수 있다.

인수(인자) & 매개변수의 차이

인수: 함수를 실행(호출)할 때 괄호 안에 전달하는 것
매개변수 : 일종의 플레이스홀더로서 함수를 정의할 때 용도에 따라 정해줄 수 있는 것

function myName(name) {	 // myName(매개변수)
  
	console.log(`hi, ${name}!`);
}
myName('김철수'); // myName(인수);
// hi, 김철수!

Input 이 있는 함수

function sayHello3(name) {    // (name) = parameter, 인자, Input
	return '안녕하세요, ' + name + '!'
}

let gretting = sayHello3("홍길동") // name 인자에 들어갈 값 꼭! 적고 함수 호출
								// 이때"홍길동"은 argument 라고 부른다.
console.log(gretting);

// -----> 결과: 안녕하세요, 홍길동!

Input 이 여러개인 함수

function addNumbers (num1, num2) { // 인자 순서 잘 지켜서 argument에 넣기
  								  // 순서 다르면 값도 다르게 나옴.
	let result = num1 + num2
    return result
}

let addedNumber = addNumbers(3, 5);  // num1 num2 각각의 자리에 순서대로 투입
console.log(addedNumber);
// ------> 결과: 8