괴발개발/Javascript+JQuery

JS_함수의 개념과 예제

moonday 2021. 6. 18. 00:23
더보기

- JS에서 함수는 리턴타입을 쓰지 않음, 매개변수 부분에 타입을 안씀(var제거)

 - 선언적 함수 : 함수 선언위치와 호출 위치가 중요하지 않음

 - 선언적 함수 생김새

        - function 함수명(매개변수1, ...){

          실행문;

        }

      

 

- 익명 함수 : 함수 선언위치와 호출 위치가 중요함

    => 선언하는 코드가 호출하는 코드보다 위에 있어야 함

- 익명 함수 생김새

        var 변수 = function(매개변수1, ...){

          실행문;

        }

 

    //Hello를 출력하는 printHello 함수를 선언적함수function 방법으로 선언

 function printHello(){
      document.write('Hello<br>');
    }

    //printHello 함수를 호출 (함수보다 위에있어도 상관은 없음)
    printHello();

 

    //Hi를 출력하는 printHi 함수를 익명var 함수 방법으로 선언

    var printHi = function(){
      document.write('Hi<br>');
    }
    
 	//printHi 함수를 호출 (익명함수라서 위치가 꼭 함수 아래)
    printHi();

 

 

 


더보기

    /*

     - 자바에서는 선언언된 메소드의 매개변수가 다르면 에러가 발생하지만,

        JS에서는 에러가 발생하지 않고 실행됨.

     - JS에서는 매개변수가 많은 경우, 남는 부분을 버림

     - JS에서는 매개변수가 부족하면 해당하는 매개변수는 undefined가 됨 

    */

 

   //두 정수의 합을 출력하는 함수를 선언

    function sum(num1, num2){
      document.write(`${num1} + ${num2} = ${num1+num2}<br>`);
    }
    
    sum(11,22);
    sum(11,22,33); //매개변수가 다르면, 남는 나머지 부분을 버림
    sum(); //없으면 undefined

 

    //두 수의 차를 "알려주는" 함수

function sub(num1, num2){
      return num1 -num2;
    }
    document.write(` 2 - 1 = ${sub(2,1)} <br>`);

 

 

 

     - 매개변수의 갯수가 정해지지 않은 경우, arguments객체를 이용

   // 수강 과목이 주어지면 주어진 과목을 출력하는 함수

 function printClass(){
      for(var i = 0; i<arguments.length; i++){
        document.write(`${arguments[i]}<br>`);
      }
    }
    printClass('css', 'html', 'js');
더보기

- 익명함수의 변형

      - 생김새1

        - var 함수명 = function(매개변수){실행문;}

      - 생김새2

        - var 함수명 = (매개변수) => {실행문;}

  

  // 두 수의 곱을 출력하는 함수

    var printMul = (num1, num2) =>{
        document.write(`${num1} * ${num2} = ${num1*num2} <br>`);
      }
    printMul(11,11);


    - 두 정수와 산술 연산자가 주어졌을 때, 산술 연산 결과를 알려주는 함수를 선언하고
      두 정수와 산술연산자 결과를 출력하는 코드를 작성하세요.

    function calc(num1, op, num2){
      switch(op){
        case '+' : return num1 + num2;
        case '-' : return num1 - num2;
        case '*' : return num1 * num2;
        case '/' : return num1 / num2;
        case '%' : return num1 % num2;
      }
    }
    var res = calc(1, '*', 2);
    if(res != undefined){
      document.write(`${1} ${'*'} ${2} = ${res}`);
    }else{
      document.write(`${'*'}는 올바른 산술 연산자가 아닙니다.`);
    }

 


 

'괴발개발 > Javascript+JQuery' 카테고리의 다른 글

JS_재귀함수  (0) 2021.06.18
JS_내장함수  (0) 2021.06.18
JS_prompt(팝업 입력창) 입력예제  (0) 2021.06.18
JS_전역변수와 지역변수  (0) 2021.06.18
JS_연산자(==,!=,===,!==)  (0) 2021.06.17