생활코딩 - 유효범위, callback, closure

 

• 생활코딩 JavaScript - 유효범위, callback, closure

---

Review
 
 
 
 
 
 

---

 

• 생활코딩 JavaScript - 유효범위, callback, closure

 
<지역변수와 전역변수>
 
- 지역변수 : local variable
- 전역변수 : global variable
 

var vscope = 'global';  //여기서 vscope은 전역변수
function fscope() {
    var vscope = 'local';  //여기서 vscope은 지역변수
    alert(vscope);
}
fscope();

/* 어쩔 수 없이 전역변수를 사용해야할 경우는
하나의 객체를 지역변수로 만든다. ()익명함수  */

MYAPP = {}
MYAPP.calculator = {
    'left' : null,
    'right' : null
}

MYAPP.coordinate = {
    'left' : null,
    'right' : null
}

MYAPP.calculator.left = 10;
MYAPP.calculator.right = 20;

function sum() {
	return MYAPP.calculator.left + MYAPP.calculator.right;
}
document.write(sum());

//아래처럼 익명함수 ()를 호출
(function () {
var MYAPP = {};
MYAPP.calculator = {
'left' : null,
'right' : null
}
MYAPP.coordinate = {
'left' : null,
'right' : null
}

MYAPP.calculator.left = 10;
MYAPP.calculator.right = 20;

function sum() {
	return MYAPP.calculator.left + MYAPP.calculator.right;
}
document.write(sum());
} ());

 

/* 정적 유효범위: 자바스크립트는 함수가 선언된 시점에서의
유효범위를 갖는다. 이러한 유효범위의 방식을 정적 유효범위
(static scoping) 혹은 렉시컬(lexical scoping)이라고 한다. */

var i = 5;

function a() {
    var i = 10;
    b();
}

function b() {
    document.write(i);
}

a(); //실행결과는 5


/* 값으로서의 함수: 자바스크립트에서는 함수도 객체다.
다시 말해서 일종의 값이다. 거의 모든 언어가 함수를 가지고 있다.
자바스크립트의 함수가 다른 언어의 함수와 다른 점은 함수가 값이 
될 수 있다는 점이다. */

function a() {}
a = {
	b:function () {
    }
};
/* 함수 a는 변수 a에 담겨진 값이다.
또한 함수는 객체의 값으로 포함될 수있다. 이렇게 객체의 속성 값으로
담겨진 함수를 메소드(method)라고 부른다. 
함수는 값이기 때문에 다른 함수의 인자로도 전달될 수 있다. */

function cal (func, num) {
	return func(num);
}

function increase(num) {
	return num + 1;
}

function decrease(num) {
	return num - 1;
}
alert(cal(increase, 1));
alert(cal(decrease, 1));


//함수는 함수의 return 값으로도 사용할 수 있다.
function cal(mode)
	var funcs = {
    'plus' : function(left, right) {return left + right},
    'minus' : function(left, right) {return left - right}
	}
	return funcs[mode];
}
alert(cal(plus, 1) (2,1));
alert(cal(minus, 1) (2,1));


//함수는 배열의 값으로도 사용할 수 있다.

var process = [
    function(input) { return input + 10;},
    function(input) { return input * input;},
    function(input) { return input / 2;}
];

var input = 1;

for(var i = 0; i < process.length; i++) {
    input = process[i] (input);
}
alert(input);

//함수는 변수, 함수의 매개변수, return 값으로 사용될 수 있다.

 
 
<callback (콜백 함수)>
 
- 비동기 처리 : 콜백은 비동기 처리에서도 유용하게 사용된다. 
시간이 오래 걸리는 작업이 있을 때 이 작업이 완료된 후에 처리해야 할 일을 콜백으로
지정하면 해당 작업이 끝났을 때 미리 등록한 작업을 실행할 수 있다.
 
 
<closure (클로저)>
 
: closure (클로저)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을
가리킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인
개념으로 활용된다.