공부/JAVASCRIPT

[javascript] 함수 (function)

알로하리미 2021. 3. 8. 11:09
728x90

- JS에서 함수는 first-class function이다. (1급객체이다.)

다른변수와 마찬기지로
변수에 할당이 될수 있고
함수의 인자(매개변수)로 전달이되며
return값으로 반환 할 수 있다.

 

- 함수의 선언

함수선언식 :
function 함수이름 ( 매개변수 ) { 
    실행문 return ; 
}

 

함수표현식: 
//anonymous function 익명함수
const print = function(){    };

//named function
//디버깅 할때 이름이 나와서 디버깅시 유리 하다.
const print = function print() {} ; 

* 함수선언식과 함수 표현식의 차이점

함수선언식은 var hosting처럼 JS는 함수선언식을 runtime시에 위로 끌어 올려 위에서 선언된 것처럼 해준다.
그래서 함수 선언전에 호출이 가능하다.
함수표현식선언은 선언되기전에 호출되면 에러가 난다.

 

- 함수이름 명명법 : dosomething, command, verb(동사형)

- 함수는 object이다. 즉, 레퍼런스를 갖고있다.

- 매개변수종류

premitive param (값 형식의 파라미터) 
object param (레퍼런스(주소)형식의 파라미터)

 

- default 매개변수 (ES6문법 ie불가)

function ( a = 10, b = 5 )  //매개변수 기본값 설정
{
    console.log(a);
    console.log(b);    
}

 

- rest 매개변수  (ES6문법 ie불가)

function doSomething(...params)//함수선언
{
    //let , const ES6문법 ie 사용불가 사용하려면 var키워드 사용
    //또는 ES6문법을 사용한뒤 babel로 es5로 전환 하는 방법 사용
    for(let i=o; i < params.length ; i++)
    {
        console.log(params[i]);
    }
    
    //for...of ES6문법 ie 사용불가
    for( const arg of params)
    {
        console.log(arg);
    }
    
    //arrow함수 밑에서 설명할 예정
    params.forEach( (arg) => console.log(arg) );
}

doSomething('a','2','3') ; //함수 호출

 

- local scope의 개념

밖에서는 안이 보이지 않고 안에서는 밖이 보인다.(즉, 안에서는 밖이 변수등이 접근이 가능하고 밖에서는 안의 변수등이 접근 불가능한다.)

parent()
{
    let p1 = 10;
    chidren()
    {
        console.log( p1 ) ; // 접근 가능 10
        let c1 = 10 ;
    }
    
    console.log( c1 ) ; // c1 undefined
}

*중첩된 함수에서 자식의 함수가 부모함수에 정의된 함수에 접근이 가능한 것들이 클로저의 기본개념이다.

 

- Return a value: 모든 함수는 Return이 있는데 return undefined; 는 생략이 가능하기에 return했다고 볼수 있다.

- Early return, early exit 조건이 맞지 않을때는 빨리 함수를 종료시켜라. 즉, 앞쪽에서 유효성 검사를 실시후에 실행하라.

- call back 함수 : 함수의 매개변수로 함수를 전달해서 조건이 맞으면 매개변수 함수를 호출하는 것을 콜백함수라 한다

 

- Arrow function : 항상 anonymous 함수이다.

//함수표현식
const a = function(){
    console.log('arrow')
}

//위와 같은 의미의 arrow 함수
//실행문이 한줄이면 {} 중괄호 생략가능, return 생략가능
const a = () => console.log( 'arrow' );

const add = (a, b) => a+b;

//실행문이 두줄이상이면 중괄호 생략 불가
const add = (a, b) => {
   console.log(a + '' + b ) ;
   return a+b ; 
}

.

- IIFE (즉시실행함수 ) : Immediately Invoked Function Expresstion

선언하자마자 함수를 호출.

//선언된 함수를 ()로 감싸고 뒤에 ()를 붙이면
//선언된 함수를 즉시 호출 할 수 있다.
(   
    function hello() 
    {
        console.log("hello");
    }
) ();


//매개변수를 넣어서 즉시 호출도 가능하다.
let str = "알로하하리미" ; 
(   
    function hello(str) 
    {
        console.log("hello" + str);
    }
) (str);