함수란?
- 특정 기능을 수행하는 소스 코드를 따로 묶어놓은 덩어리
- 자주 실행해야 하는 기능에 포함된 명령이 여러가지일 때 그 명령을 한번에 실행할 수 있게 한 덩어리로 묶어줌
- 정의되어 있는 함수는 호출되어야 실행됨
변수 vs 함수
| 변수 |
함수 |
| 1개의 데이터만 저장 |
자바스크립트 코드를 저장 |
| var이라는 키워드를 이용하여 선언 |
function이라는 키워드를 이용하여 선언 |
| 문자형, 숫자형, 논리형 데이터를 보관 |
출력문, 제어문 등의 코드를 저장하고 데이터를 반환 |
| 객체를 참조 |
|
함수 정의문
기본 함수 정의문
- 정의되어 있는 함수는 호출되어야 실행됨
function 함수명(){
실행 명령;
}
익명 함수 선언
- 함수명이 없는 함수, 함수 자체를 식으로 사용
참조변수 = function 함수명(){
실행 명령;
}
함수 실행
- 함수를 선언한 뒤 실행하기 위해서는 함수의 호출 필요
함수명();
또는
참조 변수();
//-------------------------
function addNumber(){
const sum = 10 + 20;
console.log(sum);
}
// 아무런 반응 없음
addNumber();
함수의 매개변수
function 함수명(매개변수 1, 매개변수 2...){
실행 명령;
}
//---------------------------------------
함수명(데이터 1, 데이터 2...)
function addNumber(a, b){
const sum = a + b;
console.log(sum);
}
addNumber(10, 20);
- 값을 고정해놓고 사용하는 함수가 아닌 사용자의 입력에 따라 결과를 출력할 수 있음
함수의 매개변수 기본값 지정
function multiple(a, b = 5, c = 10){
return a * b + c ;
}
multiple(5, 10, 20); // a=5, b=10, c=20
multiple(10, 20); // a = 10, b = 20, c = 10(기본값)
multiple(30); // a = 30, b = 5(기본값), c = 10(기본값)
매개변수 없이 함수에 전달된 값 사용
- argument : 매개변수를 사용하는 것 처럼 함수 호출문의 값을 받아올 수 있음
- 매개변수가 없는 상태에서 데이터를 전달하여 함수를 호출하면 그 값은 배열에 저장됨
function 함수명(){
arguments;
}
함수명(데이터1, 데이터2...)
//---------------------------------------
function sum(){
const sum = arguments[0] + arguments[1];
console.log(sum);
}
sum(10, 20);
return
- 함수에서 결과값을 반환할 때 사용
- return문 실행 시 반복문의b break문과 비슷하게 코드가 강제로 종료됨
함수의 적용범위
- 함수 스코프 : 범위를 의미하며, 변수 또는 함수의 유효 범위를 뜻함
지역변수
- 함수 안에서 선언하고 함수 안에서만 사용
- 지역변수는 전역변수에 영향을 주지않음
전역변수
- 스크립트 소스 전체에서 사용할 수 있는 변수
hello(); // 10
hello(); // 11
let score = 10; // 전역변수
function myFnc(){
let score = 50; // 지역변수
alert(score); // 50
}
myFnc();
alert(score); // 10
let index = 10; // 전역변수
function hello(){
console.log(index);
index++;
}
즉시 실행 함수
(function (){
실행 명령;
}());
또는
(function(){
실행 명령;
()});
//---------------------------------------
let result = (function(){
return 10 + 20;
}());
console.log(result);
