달력

12

« 2019/12 »

  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  •  
  •  
  •  
  •  

선언적 함수 vs 익명 함수

선언적 함수

익명 함수

선언적 함수를 사용할 경우는 호출 문이 먼저 나와도 에러 없이 처리됨

  

익명 함수를 사용할 경우는 호출 문이 함수 선언 이후에 호출되어야 에러가 발생하지 않음

   

   

학습 내용

  • 선언적 함수: 동일한 함수명 사용가능
    • javascript는 동일한 함수명 사용가능
    • 동일한 함수명 사용시 에러 나지 않음
    • 마지막에 호출된 함수가 수행됨
  • 선언적 함수: 함수 선언 전에 호출
  • 익명함수: 동일 함수명 사용
  • 익명함수: 함수 선언 전에 호출

   

   

전체 소스

   

<html>

<head>

<meta charset="UTF-8">

<title>선언적 함수 vs 익명 함수</title>

<script type="text/javascript">

//javascript 동일한 함수명 사용가능

//동일한 함수명 사용시 에러 나지 않음

//마지막에 호출된 함수가 수행됨

document.write('선언적 함수: 동일한 함수명 사용가능 ===========<br>');

function aaa(){

document.write('함수1 aaa<br>');                

}

function aaa(){

document.write('함수2 aaa<br>');                

}

//함수 호출

aaa();

   

document.write('<br>선언적 함수: 함수 선언 전에 호출 ===========<br>');

//선언적 함수를 사용할 경우는 호출문이 먼저 나와도 에러없이 처리됨

//함수 호출

bbb();

function bbb(){

document.write('함수 bbb<br>');

}

   

   

document.write('<br>익명함수: 동일 함수명 사용===========<br>');

var ccc = function(){

document.write('함수1 ccc <br>');

};

var ccc = function(){

document.write('함수2 ccc <br>');

};

//함수 호출

ccc();

   

document.write('<br>익명함수: 함수 선언 전에 호출 ===========<br>');

//선언적 함수를 사용할 경우는 호출문이 먼저 나와도 에러없이 처리됨

//익명 함수를 사용할 경우는 호출문이 함수 선언이후에 호출되어야 에러가 발생하지 않음

//함수 호출        

//ddd();        //오류 발생

var ddd = function(){

document.write('함수 ddd <br>');

};        

   

</script>

</head>

<body>

</body>

</html>

   

출처: <https://github.com/10zeroone/study_javascript/blob/master/WebContent/ch04-function/02.html>

   

   

   

익명함수: 함수 선언 전에 호출

소스 코드

ddd();        //오류 발생

var ddd = function(){

document.write('함수 ddd <br>');

};        

   

출처: <https://github.com/10zeroone/study_javascript/blob/master/WebContent/ch04-function/02.html>

   

   

Posted by codedragon codedragon

댓글을 달아 주세요

익명 함수 생성 (함수 표현식 방식), function expression

함수 리터럴로 하나의 함수를 만들고, 생성된 함수를 변수로 할당하여 함수를 생성하는 방법으로,

자바스크립트에서는 함수도 하나의 값처럼 취급됩니다.

함수표현식을 사용한 익명함수 생성시 세미콜론(;)을 붙이는 것을 권장합니다.

var 함수변수= function (매개변수명 ) {

코드

return 반환값 // 반환할 값이 있을 경우 지정

};

   

함수 호출

함수변수(매개변수에 전달할 값);

   

   

소스 코드

<html>

<head>

<meta charset="UTF-8">

<title>함수표현식으로 함수생성</title>

<script type="text/javascript">

//add() 함수 표현식 정의

var add = function (x, y) {

return x + y;

};

//add 가지고 있는 함수 참조값을 plus변수에도 그대로 할당

var plus = add;

//함수 표현식으로 생성된 함수 호출

document.write(add(1,2) + '<br>');

//동일한 함수 참조값을 가진 변수를 통해 함수 호출

document.write(plus(3,4) + '<br>');

   

</script>

</head>

<body>

</body>

</html>

   

출처: <https://github.com/10zeroone/study_javascript/blob/master/WebContent/ch04-function/16.html>

   

Posted by codedragon codedragon

댓글을 달아 주세요

Function( )생성자 함수

일반적으로 자주 사용되지 않으므로 소스 분석 수준으로만 알아두기 바랍니다.

var 함수= new Function (arg1, arg2, arg3,…… argN, functionBody)

   

arg1, arg2, arg3,…… argN

함수의 매개변수

functionBody

함수가 호출될 때 실행되는 코드를 포함한 문자열

   

   

소스 코드

   

<html>

<head>

<meta charset="UTF-8">

<title>function() 생성자 함수를 통한 함수 생성</title>

<script type="text/javascript">

var add = new Function('x', 'y', 'return x + y');

document.write(add(1, 2));

</script>

</head>

<body>

</body>

</html>

   

출처: <https://github.com/10zeroone/study_javascript/blob/master/WebContent/ch04-function/17.html>

   

   

Posted by codedragon codedragon

댓글을 달아 주세요