[JS] 31. 자바스크립트의 변수

1) global 변수

var f1 = function(){
	a= 1;
	var a;
    
	alert(a);
	alert(window.a);
}

결과는 undefined가 나온다. / alert(a)는 1이 나온다.
function 안에서는 변수를 선언하기 전(a=1;까지)에는 a는 전역변수에 들어가는 속성인데

변수를 선언한 이후에는 1을 대입한게 의미가 없어진다. (전역변수가 아니게 된다.)
그래서 alert(window.a);는 지역변수를 활용하게 된다.

우선순위가 var가 먼저 인식되면서 a=1;이 지역변수가 된다.

window.a에서 a는 전역변수 var a에서 a는 지역변수이다.

var f1 = function(){
	a= 1;
	var a;
    
        a++
    
	alert(a);
	alert(window.a);
}

alert(a);는 2가 나온다.

동일한 변수를 여러 번 선언하는 경우

둘다 전역변수이다.

에러가 나야 정상인데 안난다.

var a = 1;
var a = 2;

alert(a);

중괄호를 사용하는 경우

결과는 1이 나온다.

변수를 중괄호를 사용해 선언하는 경우, 자바스크립트에선 중괄호가 아무 의미없다.

{
	var a = 1;
}
alert(a);

결과는 undefined가 나온다.

alert(a);

{
	var a = 1;
}

2) global 변수와 지역변수

function f1(){
	var a = 1;
    
}

f1();

alert(a);

함수 안에서의 변수

에러가 발생한다.

function f1(){
	a = 1;
    
}

f1();

alert(a);

여기서 a는 전역변수이므로 결과로 1이 나온다.

함수 안에서 선언한 global 변수

function f1(){
	var a = 1;
	f2();
    
	function f2(){
		var a = 2;
		f3();
        
		function f3(){
			var a = 3;
		}
			console.log(a);
	}
}

f1();

console.log(a);는 3이 출력,
var a = 3;이 없다면 2가 출력,
var a = 2;가 없다면 1이 출력된다.

영역 안에서는 전역변수가 된다.

function f1(){
	var a = 1;
	f2();
    
	function f2(){
		a = 2;
		f3();
        
		function f3(){
			console.log(a);
			console.log(window.a);
		}
	}
}

f1();

console.log(a);는 2가 나오고 console.log(window.a);는 undefined가 나온다.

그러므로 a = 2;는 전역변수가 아니다.

같은 이름으로 밖에 있으면 전역변수가 안된다.
의도했던게 전역변수라면 전역 객체를 써주는게 좋다.

a = 2;를 window.a=2;로 써주자.
바깥에 있는 inner function 때문에 메모리에서 소거가 안되는 문제가 있다.

3) 클로저

function f1(){
	var a = 1;
	return a;
}

var a = f1();
alert(a);

return a 에서 a는 객체이다.

function f1 안에는 primitive type이므로 return a에서 a는 객체이지만

참조가 아닌 값이 반환된다.

그리고 var a = 1;에서 1이 다시 박스가 되어 a가 1을 참조한다.

return a가 되는 순간 function f1()안에는 전부 사라진다.

function f1(){
	var a = 1;
	return function f2(){
		return a;
        }
}

var f = f1();
var a = f();
alert(a);

function f2는 객체여서 반환하는데 문제는 없는데

여기서 a는 자기 지역변수가 아닌 f1의 var a = 1; 을 사용한다.

f1에서 return 되면 사용한 자원이 사라져야 하지만 f2의 return a;때문에 f1의 자원들이 사라지지 못한다.

f2는 f1(outer function)을 닫게할 것이냐 아니냐를 결정하는 키가 된다. 이 리턴되는 function을 클로저(Closure)라고 한다.

즉, outer에 잇는 변수를 씀으로써 outer가 사라지는 것을 못하게 하는 것이 클로저이다.

        function f1(){
            var a = 1;

            return function(){
                console.log(a);
                return a;
            }
        }

        var closurefunction = f1();
        closurefunction();

        closurefunction = null;

closurefunction = null;로 가비지컬렉터가 수거 -> f1() 스택도 같이 사라진다.

4) 함수 객체

함수도 간단하게 전달 가능하다.
함수는 객체이기 때문에 함수의 인자로 전달 가능.

print의 function()이 전달되고 있는 인자이다.
정렬 기준을 sort한테 전달할 수 있다.

	var nums = [4,7,3,1,6,3,2,11,9];
	console.log(nums);

	nums.sort();
	console.log(nums);

        var nums = [4,7,3,1,6,3,2,11,9];
        console.log(nums);


        nums.sort(function(a, b){

            return a - b; //오름차순 b-a는 내림차순, 0이면 그대로
        });
        console.log(nums);

        var exams = [{kor:10, eng:30}, {kor:32, eng:42}, {kor:19, eng:90}];
        console.log(exams);


        exams.sort(function(a, b){
            return kor.a - kor.b; // 원하는 기준으로
        });
        console.log(exams);