[함수] 함수의 기본

 

함수의 분류

• 사용자 정의 함수 : 사용자가 필요한 기능을 직접 만든 함수
• 자바스크립트 코어 함수 : 자바스크립트 기본적으로 제공하는 함수  ex) pasreInt(), Math.random()..

기본 구조

• INPUT(parameter) >  function() > OUTPUT

기본 문법

1. 함수의 선언
function 함수명(매개변수, 매개변수 ...){
	문장
	return 리턴값
}

2. 함수 실행
함수명();

Source

function add(a, b) { // 입력(a,b)
  let sum = a + b; // 할일
  return sum; // 출력
}


let result = add(1, 5);
document.write(result); // 6

---

함수의 파라미터 초깃값 설정

• '파라미터=값'을 사용하여 초기값 설정 가능
• 초기값으로 설정된 파라미터는 값을 전달받지 않으면 초기값을 사용하는데 이를 '디폴트 파라미터'라고 함

기본 문법

function 함수명(파라미터, 파라미터=초기값, 파라미터=초기값) {

}​

---

임의의 파라미터를 가지는 함수 정의

• 정해지지 않은 파라미터의 개수를 가지는 함수의 경우 '나머지 파라미터(Rest Parameter) '...'을 이용하여 함수 정의
• 입력받은 파라미터는 인덱스를 이용하여 파라미터[0], 파라미터[1]의 방식으로 사용

기본 문법

// Function
function 함수명(...파라미터) {}

// Arrow Function
(...파라미터) => {}

// 인덱스를 지정하여 파라미터 사용
파라미터[0]

source

function calcSum(...prices) {
	let result = 0
	for(const value of prices) {
		result +=value
	}
	return result
}

calcSum(1,2,3) // ⇒ 6

---

함수의 변수와 리턴처리

• 함수의 리턴값을 지역변수로 선언하여 반환 받을 경우 반드시 return 처리 필요 하며, 함수내에서만 변수호출 가능
• 함수의  리턴값을 전역변수로 처리시에 return처리를 하지 않아도 되며, 함수 외부에서도 결과값 반환 가능

함수 내 지역변수 리턴값을 함수 밖에서 호출하는 방법

• 전역변수 선언 ( 전역변수로 선언 시 함수 내에서 리턴처리가 없이 결과 출력 가능)

 

// = 내부함수 활용
function add(a, b) {
  let sum = a + b;
  return sum; // 지역변수 일 때는 반드싀 리턴 필요
}

console.log(add(1, 4));

//console.log(sum); // ERROR  sum이 add 안에 선언된 지역변수라서 Error 발생

// + 해결방안 (sum을 전역변수로 선언)

let result // 전역변수

function add(a, b) {
  result = a + b;
  
}
add(3,2)
document.write(result); // 5

---

함수 활용

매개변수 값으로 함수 이용

// hi1, hi2 는 일반 함수
function hi1() {
  alert('hi');
}
function hi2() {
  alert('hi-2');
}
// 매개변수 값으로 함수를 이용
function exec(a) {  // a = hi1, a = hi2와 동일
  a(); // 매개변수로 받은 함수를 호출
}
exec(hi1);  
exec(hi2);

리턴값으로 함수 활용

$(function () {
  function hi() {
    document.write('hi');
  }
  $('#btnStart').click(hi);
});

리턴값으로 익명함수 활용

  sestInterval(function(){
        document.write('hi');
    }, 1000)

리턴값으로 중첩함수 활용

function hi() {
  // 중첩함수
  function hello(name) {
    document.write(`${name}님`);
  }
  return hello; // 리턴값으로 중첩함수를 넘기고 있음
}
//함수를 저장한 것이 아닌 hi()를 호출하고 그 리턴값으로 hello()를 받고 있음
// 중첩함수인 hello()를 받고 있는 것
const func = hi();
func('john'); // hello('john'); 동일

객체 방식으로의 함수 정의

let hi = new Function('name', 'document.write(name+"님")');
hi();

익명함수의 확장으로 함수 정의

• 재사용 목적이 아닌 다른 함수와의 충돌을 막기 위함

(function (name) {
  document.write(name);
})('john');