함수
함수는 프로그램에서 반복적으로 사용되는 기능을 만들어 내기 위한 코드들의 집합으로 이해하시면 됩니다.
| 분류 | 종류 | 설명 |
| 사용자 정의 함수 | ·선언적 함수 ·익명 함수 |
프로그램에서 필요한 기능을 사용자가 직접 정의해서 사용하는 함수입니다. |
| 내장 함수 | ·인코딩,디코딩 함수 ·숫자 판별 함수 ·유·무한 값 판별 함수 ·숫자 변환 함수 ·문자 변환 함수 ·자바스크립트 코드 함수 |
프로그램 개발에서 자주 사용되는 기능들을 자바스크립트 내부적으로 제공해 주는 함수입니다. |
선언적 함수
'선언적 함수'는 함수를 호출할 때 함수의 앞 또는 뒤에서 호출 가능합니다.
function func(){
document.write("선언적 함수");
}
func();
func();
function func(){
document.write("선언적 함수");
}
※여기서 알아둬야 할 점
변수나 함수를 선언하지 않고 호출하였을 때는 에러가 발생해야 하는 것이 맞지만, "var"로 선언한 변수와 선언적 함수는 변수, 함수 선언 이전에 호출하여도 에러를 발생시키지 않습니다. 이러한 자바스크립트 성질을 '끌어 올리기' 호이스팅(Hoisting)이라고 합니다.
console.log(unm); // 결과로 undefined가 나오지만 데이터 타입의 종류이지 에러가 아닙니다.
var num = 10;
func(); //이렇게 해도 에러는 생기지 않습니다.
function func(){
document.write("선언적 함수");
}
익명함수
익명 함수는 변수에 함수 데이터를 저장하여 변수를 마치 함수처럼 사용 할 수 있도록 만들어 줍니다.
const func = function(){
document.write("익명 함수");
}
func(); // 익명 함수는 변수 선언 이후 호출해야 합니다.
※즉시 실행 함수
익명 함수 중에는 필요에 따라 일회성으로 사용되는 함수도 있습니다. '즉시 실행함수'는 선언과 동시에 함수가 실행되며 함수명이 없기 때문에 재호출이 불가능 합니다.
(function() {
document.write("즉시 실행 함수");
})();
매개변수 함수
함수를 호출할 때 전달하는 변수를 말합니다.
function func(str){
document.write(str);
}
func("매개변수");func("매개") 변수를 function func(str)에 전달하고 그 값을 document.write(str)로 출력하고 있습니다.
리턴(return) 함수
함수를 통해 처리된 결과를 반환 시켜주는 명령어 입니다.
function func(){
const str = "함수가 실행되었습니다.";
return str;
}
document.write(func());
함수를 호출하면 실행이 되어 그결과를 다시 호출한 곳으로 돌려주고 함수를 종료 합니다.
화살표 함수
함수를 간략하게 표현할 때 사용합니다.
function 키워드를 생략하고 부등호 "=" 과 ">"을 합쳐 코딩하며 항상 익명 함수 형식으로 표현합니다.
단일 명령문일 경우에는 함수의 중괄호 {}와 return을 생략할 수 있습니다.
※화살표 선언적 함수
func = () => {
document.write("실행되었습니다.");
}
func();
※화살표 익명 함수
const func = () => {
document.write("실행되었습니다.")
}
func();
※화살표 매개변수 함수
func = (str) => {
document.write(str);
}
func("실행되었습니다.<br>");
※화살표 리턴(return) 함수
func = () => {
const str = ("실행되었습니다.<br>");
return str;
}
document.write(func());
※단일 명령문
func = () => str = ("단일 명령문");
document.write(func());
자료 출처:Responsive Web Publishing 반응형 웹 실전 프로젝트 가이드 책