Published 2022. 6. 10. 11:23
반응형

자바 스크립트 함수는 무엇일까

학교 수학 시간에 들었던 함수를 들었던 기억은 다들 있을것이다

그 원리는 같다 

어떠한 값을 넣어 내부적인 식에 의해 원하는 값을 돌려주는 그게 바로 함수이다 

 

예를 들어 숫자 두개를 넣어 두 숫자를 합하는 함수를 만들어 봐야겠다 라고 한다면

//값을 삽입하고 받아올 변수
var num = 0;
var num2 = 1;
var result = 0;

function add ( firstNum , secondNum ){
	
    return firstNum + secondNum;
    
}

result = add(num, num2);

아주 아주 간단한 함수를 하나 만들어보았다 이 방식은 일반적으로 쓰는 함수의 형태이다 

 

다른 형태로도 가능한데 이것은 조금 다른 형태이다

 

var result = function(firstNum) {

	var second = firstNum + 3 ; 
    
    return second;
}

이 방식은 함수표현식 이라고 한다 

변수를 선언과 동시에 합수를 대입한다 라고 말할수있다 

기존 방식과 다른점은 호이스팅 이라는게 있다 호이스팅이란  함수안에 있는 선언들을 모두 끌어

올려서 함수 유효범위의 최상단에 선언하는것이다 말이 어렵긴 한데 일단 이정도만

알고 지나가기로 한다

함수 표현식도 호출 하는방법은 같다

var data = result(3);

그리고 중요한것이 혼동되는 단어 문제이다 

우리가 함수를 선언할때에 받는것은 파라미터 라고 한다 

함수를 선언할때 받아와야 하는 값을 파라미터라 하고 우리가 그 함수를 사용할때에 전해주는 

값은 인자 라고 한다 

이 부분이 정확히 인지되지 않으면 혼동되기 쉬워 작성한다 

 

그리고 인자에 전해주는 값은 함수를 사용해서 넣을 수 있다 

예들 들어보자 위에 작성한 add 함수를 이용해서 값을 받아와서 다른함수에 그 값을 인자로 주고

다른 값을 만들어야 하는경우 초보자들은 흔히 하는 행위는 이와같다

var result = add(1,3);

function evenOdd(result) {

	var chk = false;

	if (result % 2 == 0 ) {
    	
        console.log("result값은 짝수입니다");
        chk = true;
    } else {
    	console.log("result값은 홀수입니다");
        chk = false;
    }

	return chk;

}

간단하게 작성한 짝수이면 true를 반환 홀수면 false 를 반환하는 함수이다 

이 부분에서 한번 수정가능 한 부분이 있다 add함수에 인자를 주어 값을 받아와서 다시 

evenOdd 함수에 인자를 준다 이 행동을 하나의 행위로 가능하다 간단하게 생각해보자 

add함수의 값은 유추해보자면 4일것인데 이 값만 인자로 넣어주면 그만이다 그리고 

evenOdd 함수는 파라미터만 받아오면 그만일것이다 그래서 우리는 간단하게 

이렇게 호출한다 

var isEvenOdd = evenOdd(add(2,3));

코드가 간결해지는것을 볼 수있다 

위의 짝수 홀수 함수또한 간단히 표현 할 수가 있다 

function evenOdd(result) {

	return result % 2 == 0 ? true : false;

}

보면 알겠지만 이런식으로 간단하게 완성 할 수있다 

if는 자주사용되는 조건문이고 가독성이 좋지만 가끔은 삼항연산자를 이용할때 코드가 간결할때가

있습니다 

 

그리고 함수선언에 대해 유의점은 return 이후는 실행하지 않습니다

 

반응형

'Developer > Javascript' 카테고리의 다른 글

[javascript]리스너  (0) 2022.06.15
[javascript]배열  (0) 2022.06.10
[javascript]자바 스크립트 기초  (0) 2022.06.09
[javascript]ajax 공통 함수로 만들어 사용하기  (0) 2022.06.02
[javascript]json parse와 값 입력  (0) 2018.04.06
복사했습니다!