반응형
1종객체(함수) 가지고 놀기_1
자바스크립트에서 함수는 프로퍼티를 가질 수 있고, 메서드를 가질 수 있고, 변수나 프로퍼티에 할당이 가능하며 일반적으로 평범한 객체들이 할 수 있는 것을 모두 할 수 있다.
var obj = {};
var fn = function(){};
=> 변수에 객체를 할당할 수 있듯이, 함수를 할당하는 것도 가능하다. 이 것은 함수를 객체의 프로퍼티에 할당해서 메서드를 만드는 데도 그대로 적용된다.
var obj = {};
var fn = function(){};
obj.prop = “obj’s property”;
fn.prop = “Fn’s property”;
=> 일반적인 객체와 마찬가지로 함수에도 프로퍼티를 추가할 수 있다.
함수 저장하기
만약에 연관성을 지닌 함수들을 컬렉션에 저장하고 싶다고 하자.
새로 추가하려는 함수가 이미 컬렉션에 포함되어 있는지 아닌지를 판단하려면, 컬렉션을 순회하며 해당 함수가 중복된 함수인지 검사하는 고지식한 방법이 존재한다.
하지만 함수의 프로퍼티를 활용하면 세련된 코드로 작성할 수 있다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> var store = { nextId : 1, cache : {}, // 함수를 저장하는 cache add : function(fn){ if(!fn.id){ fn.id = store.nextId++; return !!(store.cache[fn.id] = fn); }else{ return false; } } }; function fn(){}; console.log(store.add(fn)); // true console.log(store.add(fn)); // false console.log(fn.id); // 1 </script> </body> </html> | cs |
add()함수는 인자로 전달된 함수가 id프로퍼티를 가지고 있는지 확인하고, id프로퍼티를 가지고 있지않으면 해당 function에 id프로퍼티를 추가하고 cache객체에 등록하게 된다.
(여기서 느낌표 !! 개를 볼 수 있는데 자바스크립 표현식을 Boolean 객체로 만드는 간단한 방법이다. 예를 들어 !!”test” === true, !!0 === false가 된다.)
이 기법을 활용하면 이전에 수행한 연산의 결과를 저장해 놓을 수 있다. 이를 통해 같은 연산을 수행하는 데 드는 시간을 절약할 수 있다.
반응형
'프로그래밍 노트 > JAVASCRIPT' 카테고리의 다른 글
| [Javascript] 객체지향과 프로토타입_1 (0) | 2019.01.10 |
|---|---|
| [Javascript] 1종객체(함수) 가지고 놀기_2 (가변인자목록 arguments) (0) | 2019.01.06 |
| [Javascript] callee 프로퍼티 (0) | 2018.12.20 |
| [Javascript] 익명함수 (0) | 2018.12.17 |
| [Javascript] 스타일(CSS) 다루기 (0) | 2018.12.17 |
