2018. 2. 20. 12:46 JavaScript/개인 스터디
[JavaScript] 함수의 이해
자바스크립트 작성에 의해서 함수를 이해하는 것은 매우 중요합니다.
우선적으로 알고 들어가야 할 부분 은
자바스크립트 함수는 1종 객체 (first-class Object) 라는 점을 알고 가야 합니다.
이를 뜻하는 점은
기존에 C에서의 가정하면
void show () const
{
printf("Function Show");
}
int fn_value = 1;
에 경우가 있을때 fn_value는 int 형 변수이며
show는 함수이기 때문에
fn_value = show ; 라는 동작이 성립이 되지 않습니다.
위의 상황을 자바스크립트로 변경을 해보게 되면
function show ()
{
console.log("Functioin Show");
}
var fn_value = 1;
fn_value = show; 가 가능해지기 때문에
자바스크립트에서의 함수는 1종 객체 (First-Class Object)라는 점을 알고 가야 합니다.
위에 설명에서 C의 경우는 성립이 되지않아 저 코드 상태로 확인이 할수있는 점이 없습니다.
show를 부르고싶다면
int fn_value는 그대로 놓은 상태에서
show(); 를 호출하여야 하지만
자바스크립트 코드에서는
fn_value = show; 한 후에
fn_value(); 로 하게되면
Function Show를 확인 하실수 있습니다.
function show()
{
console.log("Function Show");
}
var fn_value =1;
fn_value = show;
fn_value();
해당 사항에 대해서 이해를 하고 넘어 가야 합니다.
이해가 되었다면
1종 객체란 무엇인가
리터럴 로 생성 될수 있다.
변수,배열 요소, 다른 오브젝트의 프로퍼티에 할당이 가능
함수의 인자로 전달 가능
함수의 결과 값으로 반환 가능
동적으로 생성된 프로퍼티를 가질수 있다.
동적으로 생성된 프로퍼티라 함은
var obj_ = [];
obj_.push({name:"test",age:"18"});
console.log(obj_[0]);
obj_.push({name:"testB",age:"20",addProperty:"addProp"});
console.log(obj_[1]);
와 같이 생성되는 점을 말할수 있다. Chrome 브라우저 개발자 도구(F12)을 누른후 콘솔 탭에서 해당 코드를 실행해보면
추가 하는형식에 따른 프로퍼티들이 동적으로 생성됨이 확인된다.
여기까지 대충 이해가 된 상태라면
브라우저에서 window 객체에 대한 특정 함수를 할당 하는 경우
function browserInit(){
// do thing
}
window.onload = browserInit;
// 방식을 사용 하는 것 보다
window.onload = function () {
// do thing
}
// 혹은
window.onload = () => {
// do thing
}
// 의 방식을 사용할수 있으며 위의 방식보다 코드도 짧아지고 좋다고 생각된다.
'JavaScript > 개인 스터디' 카테고리의 다른 글
| [JavaScript] 함수 유효범위 - 호이스팅(hoisting) (0) | 2018.03.06 |
|---|---|
| [JavaScript] 함수 유효범위 (0) | 2018.02.27 |
| [JavaScript] 함수의 이해 - 브라우저의 동작 (0) | 2018.02.20 |
| [JavaScript] 비동기 테스트 기본 (0) | 2018.02.13 |
| 자바스크립트 함수 선언에 대한 증명 (0) | 2018.02.06 |
