값으로서의 함수와 콜백(함수의 용도)
자바스크립트에서도 함수는 객체입니다. 즉, 함수 자체가 값이 될 수 있습니다.
var a =
function(){ } a라는 변수에 함수가 담길 수 있습니다.
객체의 속성 값으로 담겨진 함수를 메소드(method)라고 부릅니다.
함수는 인자로 전달될 수 있고 리턴값(반환값)으로도 사용 가능합니다.
함수는 배열의 값으로 사용할 수 있습니다.
var
process = [
function(input){ return input + 10;}, //input[0] = 11
function(input){ return input * input;}, //input[1]
= 121
function(input){ return input / 2;} //input[2] = 60.5
];
var input
= 1;
for(var i
= 0; i < process.length; i++){
input = process[i](input);
}
alert(input);
콜백
function
sortNumber(a,b){
// 위의 예제와 비교해서 a와 b의 순서를 바꾸면
정렬순서가 반대가 됩니다.
return b-a;
}
var
numbers = [20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1];
alert(numbers.sort(sortNumber));
// array, [20,10,9,8,7,6,5,4,3,2,1]
콜백함수란 ? sort 기본적인 동작 방법을 변경할 수 있습니다. 즉 값으로서
함수를 사용할 수 있기 때문에 오리지널 함수의 동작방법을 값을 전달하는 것을 통해 완전히 바꿀 수 있는 것입니다.
콜백이 가능한 이유는 자바스크립트에서
함수가 값이기 때문에 콜백이 가능합니다.
비동기 처리
콜백은 비동기처리에서도 유용하게 사용됩니다. 시간이 오래 걸리는 작업이 있을 때 이 작업이 완료된 후에 처리해야 할 일을 콜백으로 지정하면 해당 작업이
끝났을 때 미리 등록한 작업을 실행하도록 할 수 있습니다. 다음 코드는 일반적인 환경에서는 작동하지
않고 서버 환경에서만 동작합니다.
대표적인 예로 AJAX(Asynchronous Javascript And XML) : 자바스크립트를 이용해 html코드를 이용해 화면에 출력
클릭 시 웹 페이지가 변경되지 않고 서버와
웹 브라우저가 내부적으로 조용히 통신하는 기법
Ajax는 웹이 단순히 문서에서 벗어나 이런 동작을 할 수 있는 애플리케이션으로 발전하게
한 단서입니다.
클로저
클로저(closure)는
내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것입니다.
클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용됩니다.
function
outter(){
function inner(){
var title = 'coding everybody';
alert(title);
}
inner(); //'coding everybody' 출력
}
outter();
//'coding everybody' 출력
내부함수에서 외부함수의 지역변수에 접근
가능한 것이 클로저입니다.
function
outter(){
var title = 'coding everybody';
return function(){
alert(title);
}
}
var inner
= outter();
inner();
//'coding everybody' 출력
외부함수의 지역변수에 접근 할 수 있는데
외부함수의 실행이 끝나서 외부함수가 소멸된 이후에도 내부함수가 외부함수의 변수에 접근 할 수 있습니다. 이러한
메커니즘을 클로저라고 합니다. 결과는 경고창으로 coding
everybody를 출력할 것입니다.
private variable
객체 안의 함수가 있는 상태, 첫 번째 매개변수는 title, 매개변수는 함수 안에서 지역변수로 사용
get_title
메소드를 호출하면 title을
리턴합니다.
set_title
메소드는 _title이 title값을 변경합니다.
function
factory_movie(title){
return {
get_title : function (){
return title;
},
set_title : function(_title){
title = _title
}
}
}
ghost =
factory_movie('Ghost in the shell');
matrix =
factory_movie('Matrix');
alert(ghost.get_title());
//'Ghost in the shell'
alert(matrix.get_title());//'Matrix'
ghost.set_title('공각기동대');
alert(ghost.get_title());
//'공각기동대'
alert(matrix.get_title());
//'Matrix'
ghost와 matrix는 private 변수에 객체를 담았습니다
private변수가 필요한 이유는 소프트웨어의 규모가 커질수록 많은 데이터가 존재하게 됩니다.
그 데이터를 누구나 수정 가능하다면 소프트웨어가
쉽게 망가질 수 있기 때문입니다.
출처 : 생활코딩 강의
