섹션 15. 함수지향 - 클로저
1강. 내부함수, 외부함수
1) 클로저(closure)
내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 말한다.
JavaScript를 이용한 고난도의 테크닉을 구사하는데 필수적인 개념이다.
외부 함수 outter의 내부에는 내부 함수 inner가 정의되어 있다.
내부함수는 외부함수의 지역변수에 접근할 수 있다.
function outter() {
var title = 'coding everyday';
function inner() {
alert(title);
}
inner();
}
outter();
inner에 title에 대한 정의가 없기 때문에 outter에서 title = 'coding everyday'를 가져온다.
2강. 클로저란?
외부함수가 더 이상 사용되지 않는 상황에서도 내부함수가 외부함수에 접근할 수 있다.
내부함수를 포함하고 있는 외부함수에 접근할 수 있을 뿐만 아니라 외부함수가 종료(return)된 이후에도 내부함수를 통해 접근할 수 있다는 것이 클로저의 독특한 특징이다.
function outter() {
var title = 'coding everyday~';
return function() {
alert(title);
}
}
inner = outter();
inner();이미 외부함수는 값을 return 했는데도 inner(); 함수를 호출했다.
수명이 다한 외부함수 내부의 title을 끄집어내서 결과를 호출하는 상황이다.
3강. private variable
소프트웨어가 커지는 과정에서 어떤 정보가 있을 때, 아무나 수정할 수 없도록 하는 방법
많은 사람들이 소프트웨어에 손을 댄다 = 소프트웨어가 망가질 가능성이 크다.
비밀변수는 이 과정에서 소프트웨어를 지킬 수 있는 중요한 기능이 된다.
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());
alert(matrix.get_title());
ghost.set_title('공각기동대');
alert(ghost.get_title());
alert(matrix.get_title());이미 수명을 다한 factory_movie() 함수는 외부에서 더 이상 접근할 수 없다.
하지만 get_title과 set_title이라는 매소드는 접근이 가능하다.
그래서 title이라는 변수를 어떤 의미로 사용하건간에 맥락에 영향을 미치지 않는다.
title이라는 변수를 구석에 숨겨놓고, set_title을 통해서만 수정하고 get_title을 통해서만 가져올 수 있도록 하면 title이 훨씬 보호받기 때문에 안전하게 저장하고 수정할 수 있다.
이거 만든사람 대박 똑똑하네
4강. 클로저의 응용
var arr = []
for(var i = 0; i < 5; i++){
arr[i] = function(){
return i;
}
}
for(var index in arr) {
console.log(arr[index]());
}- 결괏값 : ⑤ 5
var arr = []
for(var i = 0; i < 5; i++){
arr[i] = function(id) {
return function(){
return id;
}
}(i);
}
for(var index in arr) {
console.log(arr[index]());
}- 결괏값 :
0
1
2
3
4
여긴 모르겠다.
중급이상 되면 돌아오려고 한다..
뭔지 몰라도 만든 사람이 똑똑한 건 알겠다.
섹션 16. 함수지향 - arguments
1강. argument 소개
함수에는 argument라는 변수에 담겨 숨겨진 유사 배열(배열과 아주 유사하지만 배열은 아님)이 있다.
이 배열에는 함수를 호출하면서 입력한 인자가 들어있다.
1) 매개변수(parameter)
함수나 메서드의 정의에서 사용되는 변수. 함수나 메서드를 정의할 때 어떤 값을 받아들일지를 명시할 때 사용한다. 함수나 메서드가 어떤 종류의 입력을 예상하고 처리할 것인지를 정의하는 역할을 한다.
def add(x, y) :
result = x + y
return result위에서 나오는 'x'와 'y'가 매개변수이다.
2) 인자(argument)
실제 함수를 호출할 때 전달되는 값. 함수를 호출할 때 매개변수에 전달되는 값들이 인자이다.
result = add(2, 3)위에서 '2'와 '3'이 인자이다.
- a +=
a = a+1
a에 1을 더하고 그 값을 a에 다시 넣는다. - a = 0;
a += 1;
2강. 매개변수의 수 - function length
- 함수.length : 함수로 전달된 실제 인자의 수
- argument.length : 함수에 정의된 인자의 수, 몇 개의 매개변수가 들어왔는가.
함수이름.length와 argument.length는 다른 것이다.
function one(arg1) {
console.log(
'one.length', one.length,
'arguments', arguments.length
);
}
one('val1', 'val2');위에서 함수의 매개변수는 arg1로 1개라서 one.length는 1이 된다.
그리고 인자는 one('val1', 'val2')로 2개가 되므로 argument.length는 2가 된다.
즉, 두 개는 다른 것이다.
이를 응용하면, 내가 원하는 지점에서 에러를 띄울 수 있다.
매개변수와 인자를 다르게 쓸 때 에러를 띄우면 두 개를 일치시킬 수 있을 것이다.
섹션 17. 함수지향 - 함수의 호출
1강. apply 소개
객체는 속성을 가지고 있다.
- 속성에 값이 저장돼 있다면 그것은 그냥 속성(property)라고 부른다.
- 속성에 함수가 들어있다면 메서드(method)라고 부른다.
func() : 객체
즉, 메서드를 갖고 있다.
메서드는 우리가 만든 것이 아니라 JavaScript에서 제공하는 내장된 메서드이다.
func.apply, func.call
- func()라는 함수를 호출하는 역할을 함
2강. apply 사용
o1 = {val1:1, val2:2, val3:3}
o2 = {v1:10, v2:50, v3:100, v4:25}
function sum(){
var _sum = 0;
for(name in this){
_sum += this[name];
}
return _sum;
}
alert(sum.apply(o1)) // 6
alert(sum.apply(o2)) // 185
