함수의 종류(선언적, 익명 함수, return, 매개변수, 화살표함수)

함수

함수는 프로그램에서 반복적으로 사용되는 기능을 만들어 내기 위한 코드들의 집합으로 이해하면 됩니다.

 

분류	종류	설명
사용자의 정의 함수	선언적 함수 익명 함수	프로그램에서 필요한 기능을 사용자가 직접 정의해서 사용하는 함수
내장 함수	인코딩, 디코딩 함수 숫자 판별 함수 유 •무한 값 판별 함수 숫자변환 함수 문자 변환 함수 자바스크립트 코드 변경 함수	프로그램 개발에서 자주 사용되는 기능들을 자바스크립트 내부적으로 제공해주는 함수

 

 

 

 

 

선언적 함수

 

선언적 함수의 형식

{
    function func(){
        document.write("실행되었습니다.");   //실행문이 있어야함
    }
    func();                                 //가장 기본적인 함수
}

선언적 함수의 호출

선언적 함수는 함수를 호출할 때 함수의 앞 또는 뒤에서 호출 가능합니다.

function copute() {
	console.log('선언적 함수');
}
compute();

compute();
function compute() {
	console.log('선언적 함수');
}

호이스팅(Hoisting)

변수나 함수를 선언하지 않고 호출하였을 때 에러가 발생해야 하는것이 맞지만

var로 선언한 변수와 선언적 함수는 변수, 함수 선언 이전에 호출하여도 에러를 발생시키지 않습니다.

이러한 자바스크립트 성질을 끌어 올리기 '호이스팅' 라고 합니다.

console.log(num); // undefined는 데이터 타입의 종류이지 에러는 아닙니다.
var num = 10;

compute();        // 선언적 함수
function compute() {
	console.log('선언적 함수');
}

 

 

 

 

 

익명함수

익명함수의 형식

변수에 함수 데이터를 저장하여 변수를 마치 함수처럼 사용할 수 있도록 만든다

{
    const func = function(){
        document.write("실행되었습니다.")
    }
    func();
}

익명 함수의 호출

익명 함수는 변수 선언 이후에 호출해야 합니다.

var compute = function() {
	console.log('선언적 함수');
};
compute();

 

즉시 실행 함수

익명 함수 중에는 필요에 따라 일회성으로 사용되는 함수도 있습니다.

선언과 동시에 함수가 실행되며 함수명이 없기 때문에 재호출 할 수 없습니다.

 

즉시 실행 함수의 형식

(function() {
	실행문;
})();

(function() {
	var sum = 10;
    console.log(sum);
})();

 

 

 

 

 

return, 매개변수

 

return

함수를 통해 처리된 결과를 반환시켜주는 명령어

 

매개변수

함수를 호출할 때 전달하는 변수를 '매개변수'라고 합니다.

 

매개변수가 있는 함수의 형식

{
    //let str = "실행되었습니다.";

    //function func(str){
    //    document.write(str);
    //}
    //func(str);
    //}
    // 위와같은값
    {
    function func(str){
        document.write(str);
    }
    func("실행되었습니다.");
}

매개변수의 개수가 정해지지 않은 함수

매개변수가 있는 함수의 경우 보통 매개변수 개수가 정해져 있습니다.

경우에 따라서는 매개변수의 개수를 정할 수 없는 함수를 만들어야 하는 경우도 발생합니다

이런경우 함수에 전달되는 매개변수 값을 저장해주는 arguments 객체를 사용하여 함수를 만들 수 있습니다.

function showSubject(){
	console.log(arguments[0] + ', ' + arguments[1]); // html, css
    console.log(argumensts.length);  // 2
}
showSubject('html', 'css');

함수 안에 arguments 객체를 사용하면 매개변수 값들을 배열 (Array) 이라는 형태로 저장

arguments
[0]	[1]
'html'	'css'

 

 

 

 

 

화살표 함수(Arrow function)

'=>'를 이용하여 함수를 간결하게 표현

 

단일 명령문일 경우 함수의 중괄호{}와 return을 생략할 수 있습니다.

fucntion func(){
	document.write("실행되었습니다<br>")
}
func();

func = () => {
	document.write("실행되었습니다<br>")
}
func();