2021-07-21강의록_JavaScript 함수(function)

무명함수 선언

함수 표현식을 선언하여 변수에 할당하는 방법.
변수를 함수명으로 사용한다.
함수 선언 전에 함수 호출 불가능.

// 1. 기본함수 선언
function printMsg(msg) {    //기본함수 선언
    console.log("1. 기본함수 :" , msg);
} //printMsg

printMsg("호출되었습니다.");    //함수호출

// 2. 변수에 함수 표현식으로 익명함수 대입
// var printMsg=function (msg) {    //무명함수 선언
var printMsg=function ttt(msg) {    //무명함수 선언
        //  =function (함수명 생략) (msg)
    console.log("2. 무명함수 :" , msg);
} //printMsg

// 둘 중 뭐가 호출될까??    >> 무명함수 호출됨!!
printMsg("호출되었습니다.");    //함수호출

// *** 이름이 있는 기본 함수일지라도, 한 번 함수 표현식으로 변수에 대입되면
// 원래의 함수명은 사용 불가! >> 변수명으로만 호출 가능
// ttt("TTT"); //참조에러. ttt가 정의되지 않았다!

console.log("printMsg: " , printMsg);

무명 함수가 먼저 오든, 기본 함수가 먼저 오든
함수 호출구문이 함수 선언부보다 먼저 호출되면 기본 함수를 찾고,
함수 선언부 이후에 호출되면 익명함수를 찾는다.

---

js 함수에는, return타입 선언부가 없다.
반환을 해야할 경우, 함수블록 내에서 return 구문 작성하면 됨.

---

함수를 변수에 담고 말고는 개발자 마음.
변수에 담을 땐, 이후에 해당 함수를 계속 사용할 때! (재사용성)

---

ES6 : Template String

${변수명} : 지정변수의 값을 주입(injection)

function add(x, y){
    // console.log("add(x,y) invoked.");
    // ES6: Template String 을 이용한 로그 출력
    //      ${변수명} : 지정변수의 값을 주입(injection)
    console.log(`add(${x} ,${y}) invoked.`);

    return x+y;
} //add

---

함수 overloading, arguments 객체

//함수 overloading이 가능한지? 예제

function add(){
    console.log("1. add() invoked.");
    
    var sum=1;  //지역변수 (함수블록 안에서 선언)
    
    return sum;
} //add


function add(x){
    console.log(`2. add(${x}) invoked.`);

    var sum = x+1;

    return sum;
} //add


function add(x, y, z){
    console.log(`3. add(${x},${y},${z}) invoked.`);

    console.log('\t typeof x:', typeof x);

    var sum=x+y+z;

    return sum;
} //add


function add(x, y){
    console.log(`3. add(${x},${y}) invoked.`);

    // console.log('\t typeof x:', typeof x);
    // arguments : 함수블록 안에서만 사용 가능한 키워드
    console.log(arguments);
    console.log(arguments[0]);
    // 함수 호출될 때, 함수에 전달된 모든 전달인자값을 저장하는, 배열과도 비슷한 객체(like array)

    var sum=x+y;

    return sum;
} //add

/////////////////////////
// 함수 호출 테스트
var r0 = add();
var r1 = add(1);
var r2 = add(2, 3);
var r3 = add(4, 5, 6);
var r4 = add(7, 8, 9, 10);  //???

console.log("A. add() -> 함수호출 인자 없음 :", r0);    //NaN (Not a Number)
console.log("B. add(1) -> 함수호출 인자 부족 :", r1);   //NaN (Not a Number)
    // 
console.log("C. add(2, 3) -> 정상적인 함수 호출 :", r2);
console.log("D. add(4, 5, 6) -> 4,5만 인자값으로 적용 :", r3);
console.log("E. add(7, 8, 9, 10) -> 7, 8 만 인자값으로 적용 :", r4);

• 결과적으로, 함수 오버로딩 없다!
  최종적으로 선언된 함수만 살아남음.
  단, js는 컴파일 언어가 아니므로 컴파일 오류는 발생하지 않는다!!!

• arguments : 함수블록 안에서만 사용 가능한 키워드.
  함수 호출될 때, 함수에 전달된 모든 전달인자값을 저장하는, 배열과도 비슷한 객체(like-array 객체)