script_기초_함수

함수 (fuction) 

      --자주 쓰는 실행코드들을 블록단위로 묶어서 패키징한 형태

      --자주 쓰는 코드들을 기능 단위로 묶어서 재사용

      --함수정의 : 미리 function 키워드로 자주 쓰는 코드들을 묶어준 형태

      --함수호출 : 미리 정의되 었는 함수를 호출해야 바로 실행됨

 

변수의 유효범위 (변수의 scope)

       -- 지역변수 : 블록안에서 선언된 변수 (해당 블록에서만 읽힘)

       -- 지역변수를 쓰는 이유 : 특정 코드블록 안에서만 전용으로 쓰이는 정보값을 저장

       -- 전역변수 : 블록밖에서 선언된 변수 (어디서든 읽힘)

       -- 전역변수를 쓰는 이유 : 복수개의 함수나 코드블록안에서 특정 값을 공유해야될때

 

호이스팅(hoisting)

       --블록안에서 선언된 지역변수값이 블록바깥으로 강제로 끌어올라가져서 전역변수화

       -- 일반함수 블록이 아닌 조건문, 반복문 안쪽에 있는 지역변수는 호이스팅이 발생

 

함수의 종류

      --선언적함수 : 함수에 미리 이름을 붙여서 정의해 놓은 상태

                              자바스크립트 파일을 읽을 때 선언적함수를 우선적으로 읽어줌

                              선언적 함수는 호출 위치가 자유로움

      --익명함수 :     함수에 이름이 없이 정의하는 형태

                              익명함수 자체만으로는 호출이 불가능

                              변수에 익명함수를 대입하거나 (대입형) 특정 이벤트 객체에 대입하는 식으로 호출 가능

      --대입형함수 : 변수에 익명함수가 대입된 형태

      --즉시실행함수 : 함수가 자기자신을 정의 하자마자 바로 자신을 호출

      --화살표함수 (arrow function) : 기존의 대입형함수의 형태를 좀더 간결하게 표현한 구문

                                                       (this객체를 생성하지 않음- 객체지향 프로그램시 편리)

//선언적 함수

plus(); 
        
function plus(){
    const Num1 = 2;
    const Num2 = 3;
    console.log(Num1+Num2);
}

plus();
plus();

//대입형 함수
const minus = function(){  //함수이기는 하지면 변수에 대입하므로 위치가 자유롭지 않다.
    const Num1 = 2;
    const Num2 = 3;
    console.log(Num1-Num2);
}

minus(); 

/*즉시실행 함수를 쓰는 이유
  -즉시실행 함수 안쪽의 값들을 캡슐화 (호이스팅 방지)
*/
(function(){
    const Num1 = 2;
    const Num2 = 3;
    console.log(Num1+Num2);
})()

 

함수 매개변수(parameter) 

      --함수내부로 특정 값을 전달하기 위한 통로이름

인수(argument) 파라미터, 매개변수

      --함수를 호출할때 파라미터를 통해서 매개변수로 전달되는 값

        function 함수명(매개변수){

         }

         함수명(인수);

리턴값(return) 

      --함수 내부에서 만들어진 값을 함수 호출시 외부로 내보내는 값

      --함수구문 실행도중 특정시점에서 강제로 코드를 실행 중단될 때

 
 function plus(){
    const Num1 = 2;
    const Num2 = 3;
    const result = Num1+Num2;
    console.log(result);
}

//매개변수인 Num1, Num2
function plus(Num1, Num2){
    const result = Num1+Num2;
    console.log(result);
}

plus(3, 5)

//리턴값 result
function plus(Num1, Num2){
    const result = Num1+Num2;
    console.log(result);
    return result;
}

const total = plus(3, 5);
console.log(total);//리턴 없으면 undefined

 

화살표 함수(Arrow function)

const plus = function(Num1, Num2){
    const result = Num1+Num2;
    return result;
};
const total = plus(3, 5);
console.log(total);


//화살표 함수(Arrow function)
//기존의 익명함수를 좀 더 쓰기 편하게 축약한 형태
const plus = (Num1, Num2) => {
    const result = Num1+Num2;
    return result;
}
const total = plus(3, 5);
console.log(total);

//내부로 전달되는 파라미터가 하나면 괄호는 생략가능
const abs = txt => {
    console.log(txt);
    }
abs("hello");

//코드블록안에서 실행되는 코드가 한줄이면 코드블록 괄호도 생략가능
const abs = txt => console.log(txt);
abs("hello");