Function, Scope, Closure

Function

---

function을 문자열로 선언할 수도 있다. 

그러나 이 방법은 function 내부의 코드가 복잡해질수록 가독성이 떨어지기 때문에 권장되지 않는 방법이다.

보통은 9 ~ 12줄에서 처럼 function을 선언한다.

var triangle1 = new Function('h', 'w', 'return h * w / 2');
console.log('Triangle 1: ' + triangle1(5, 2));

var param = 'h, w';
var formula = 'return h * w / 2';
var diamond = new Function(param, formula);
console.log('Diamond: ' + diamond(5, 2));

// function literal
var triangle2 = function(w, h) {
    return w * h / 2;
}

console.log('Triangle2: ' + triangle2(5, 2));

JavaScript에서는 함수의 인수의 개수나 type이 정해져있지 않다.

개발자가 의도한 인수의 개수 이상을 넣어도 오류가 나지 않는다.

// named argument
function triangle(args) {
    if (args.base == undefined) {
        args.base = 1;
    }
    
    if (args.height == undefined) {
        args.height = 1;
    }
    return args.base * args.height / 2;
}

console.log('Triangle1: ' + triangle({base: 10, height: 5}));
console.log('Traingle1: ' + triangle({}));

function triangle2(base, height, index) {
    console.log(base + '/' + height);
}

var base = 10;
var index = 20;
triangle2(base, index);
triangle2(base, index, 100, [10, 20]);

또한 JavaScript에서는 function의 인수로 function을 받을 수도 있다.

// Higher order function
function arrayWalk(data, func) {
    for (var key in data) {
        func(key, data[key]);
    }
}

function showElement(key, value) {
    console.log(key + ': ' + value);
}

var arr = [1, 2, 4, 8, 16];
arrayWalk(arr, showElement);

// anonymous function
arrayWalk(arr, function(key, value) {
    console.log(key + ': ' + value);
});

Scope

---

function 내에서 선언한 변수(Local 변수)가 Global 변수와 변수명이 같을 때 Local 변수를 우선적으로 참조한다.

또한 function 내에서 Global 변수와 같은 변수명으로 선언한 것보다 위에 그 변수를 참조하게 되면 선언되지 않은 변수로 인식을 한다.

var scope1 = 'Global var1';

function getValue1() { 
    console.log(scope1); // undefined
    var scope1 = 'Local Var1';
    return scope1;
}

console.log(getValue1()); // Local Var1
console.log(scope1); // Global Var1

var scope2 = 'Global Var2';

function getValue2() {
    scope2 = 'Local Var2';
    return scope2;
}

console.log(getValue2()); // Local Var2
console.log(scope2); // Local Var2

// not support block level scope
if (true) {
    console.log('True 1');
    var i = 5;
}

console.log(i); // 5

// support function level scope
(function() {
    if (true) {
        console.log('True 2');
        var j = 0;
    }
})();

console.log(j);

// ---------------------------------------------------------

// difference between function
var scope = 'Global Var';
function checkScope() {
    var scope = 'Local Var';
    
    var func1 = function() {
        return scope;
    }
    
    console.log(func1()); // Local Scope
    
    var func2 = new Function('return scope;');
    
    console.log(func2()); // Global Scope
}

checkScope();

// ---------------------------------------------------------

var x = 'Global';

function outerFunc() {
    var y = 'Local Outer';
    
    function innerFunc() {
        var z = 'Local Inner';
        
        console.log(x);
        console.log(y);
        console.log(z);
    }
    
    innerFunc();
}

outerFunc();

arguments

---

function showMessage(args) {
    console.log(arguments);
    console.log(arguments.length + ' / ' + args);
}

showMessage();
showMessage('Tomoto', 'Banana');

function paramTest() {
    for (var i = 0; i < arguments.length; i++) {
        console.log(arguments[i]);
    }
}

paramTest('a', 1, [10, 20, 30]);

재귀함수

---

function factorial(n) {
    if (n != 0) {
        return n * arguments.callee(n - 1);
    }
    
    return 1;
}

console.log(factorial(3));