[Javascript] 함수

h220101·2022년 7월 31일
0
post-custom-banner

함수?

  • 메모리에 코드를 저장하는 수단이다.
  • function 키워드로 함수를 선언한다.
  • 함수는 선언 후에 실행을 해야 저장된 코드가 실행이 된다.
  • 함수는 익명함수, 일반함수가 있다.
  • 함수는 지역변수, 전역변수 차별이 확실하다.

함수 선언

🔸일반함수 구문 : function 함수명 ( ){ }
🔹익명함수 구문 : var 함수명 = function ( ){ }


🔸일반 함수

  • 이름이 있는 함수
  • 일반함수는 선언 위치에 상관없이 호출이 가능하다.
    *호이스팅기술 : 자바스크립트가 처음 읽힐 당시에 모든 객체(변수, 함수)의 선언부를 맨 위로 끌어올린다. 함수전체(함수명, 함수바디)가 통째로 호이스팅 되어 맨 위로 올라가기 때문에 위치상관없이 읽을 수 있다.
	<script type="text/javascript">
		//fn01 메모리에 함수영역에 있는 코드를 저장
        
        function 함수명(){
  		함수 로직
		}
        
		function fn01(/*매개변수*/){
			console.log('fn01');  //출력:fn01
			//return;
		}
		fn01();
	</script>

🔹익명 함수

  • 이름이 없는 함수
  • 단독으로 선언이 불가능하며, 대입을 해줘야 선언이 가능하다. (변수, 매개변수)
  • 호출부 위에 선언이 되어있어야 정상작동을 한다.
    (순서상 : 선언 -> 호출)
	<script type="text/javascript">
		var fn02 = function(/* 매개변수 */){
			console.log('fn02');
			//return;
		}
</script>

함수 호출

선언된 일반함수 -> 함수명();
익명함수 -> 대입된 변수명();

<script type="text/javascript">
		fn03(); //호이스팅 적용 -> 선언위치 상관없이 호출
		function fn03(){
			console.log('fn03');
		}
		fn03();
		
		//fn04(); -> 익명함수 호출은 선언 아래에서 호출 해야함
		var fn04 = function(){
			console.log('fn04');
		}
		fn04();
</script>

함수를 변수에 대입하기

  • 함수를 실행하지 않고 호출 시 함수 코드를 가지고 온다.
  • 함수코드를 다른 변수에 저장이 가능하다.
<script type="text/javascript">
		function fn05(){
			console.log('fn05 함수 실행')
		}
		var fn06 = function(){	
			console.log('fn06 함수 실행')
		}
		var fnv01 = fn05; //함수 실행하지 않아야 변수에 함수 주소 대입가능
		var fnv02 = fn06;
		
		console.log(fnv01,fnv02);
		
		//매개변수에 함수 대입하기
		function fn07(fn){
			console.log(fn,'매개변수');
			console.log(typeof fn,'자료형 확인');
			if(typeof fn == 'function'){
			fn(); //함수임으로 실행 가능
			}
		}
		fn07(fn05); //fn07함수를 실행하면서 fn05 함수 코드를 인수로 삽입
		fn07(fn06); //fn07함수를 실행하면서 fn06 함수 코드를 인수로 삽입
		fn07(function(){ // 함수호출시 인수로 함수코드를 전달
			console.log('익명함수');
		})
</script>

매개변수

  • 함수명(매개변수) -> 함수 호출 시 인수를 넣어 인자값을 받을 수 있는 수단
  • 함수 호출 -> 함수명(인수1, 인수2..) -> 함수 매개변수(인자1, 인자2...)
<script type="text/javascript">
		function vfn01(n1,n2){	//인수로 삽입된 순서대로 매개변수 순서 위치에서 받는다.
			console.log(n1,n2); //n1 ->10, n2 ->20
		}
		vfn01(10,20);
		vfn01(10);//매개변수 갯수와 인수값이 틀려도 호출은 가능하다.
		// 인자값이 없는 매개변수는 undefined를 가지게 된다.
	vfn01(10,20,30); // 매개변수에서 인자 받는 위치가 없어도 실행은 가능하다.
```
profile
기록하는 삶
post-custom-banner

0개의 댓글