자바스크립트를 공부하기 시작했다. 재미 있다. 재미를 나누고 싶어 내용을 요약한다.
자바스크립트는 모든 브라우저에서 실행되는 현실적인 '대세'다. 강한 놈이 살아남는게 아니라 살아남는 놈이 강한거다 (어랏? 어디서 많이...). 자바스크립트는 웹OS, 크롬OS 같은 놈들이 확산되면 더욱 강한 놈이 될거다. 분명하다.


자바스크립트(이하 JS)의 특징
* JS 자체를 몰라도 프로그래밍을 시작할 수 있는 언어 : c, c++, java와 닮았다. 장점이자 단점이다.
* object 기반 객체지향 언어 : class 기반 객체지향 언어와 다르다.
* functional programming language : JS는 function을 특별하게 다룬다.


JS 특징들에 대한 부연설명
조금 더 설명을 덧붙이면 다음과 같다.

*  JS 자체를 몰라도 프로그래밍을 시작할 수 있는 언어 
JS는 c, c++, java로부터 많은 키워드를 차용했기 때문에 c, c++, java를 알고 있는 개발자는 별 부담 없이 JS를 이용해서 프로그래밍을 시작할 수 있다. 장점이다.
하지만 곧 언급하겠지만 JS는 c, c++, java 등과는 본질적으로 다른 특징을 갖고 있다. 기존 언어와 닮았다는 점 때문에 JS 랭귀지를 제대로 이해하고 작성한 코드가 드물다. 이건 단점이다.

* object 기반 객체지향 언어 : class 기반 객체지향 언어와 다른 언어
JS는 c, c++, java 같은 class 기반 객체지향 언어가 아니다.
JS는 객체의 족보(hierarchy)를 (class에 기반한 type이 아니라) real object 사이의 prototype-chain으로 구현한다.

* functional programming language의 특징을 갖고 있는 언어
functional programming language는,
- c, c++, java 같은 imperative programming language와 다른 개념이다.
- 가장 대중적인 최초의 functional  programming language는 LISP이다.
- state와 mutable data를 회피한다.
- 어떤 function의 결과값은 인자에 의해서만 결정된다. 따라서 같은 인자로 같은 함수를 호출하면 언제나 같은 결과를 얻는다.
- multi-CPU, multi-process, multi-thread 환경이 부각되면서 중요도가 커지고 있다.

반면 imperative programming language는,
- fortran, cobol, basic, c, c++, java 등이 있다 (OO Language를 포함)
- 명령에 의해 시스템의 state를 변화시키는 방식으로 동작한다. state 변화를 중시한다.
- 같은 인자로 같은 함수를 호출하더라도 호출하는 시점의 state에 따라 다른 결과를 얻는다 ("referential transparency가 부족하다"고 표현한다).

functional programming language 세계의 주요 개념은 다음과 같다.
- higher order function: 다른 함수를 인자로 받거나 리턴할 수 있다.
- 1st class function: 함수를 다른 intrinsic type (number, string, ...)과 동일하게 취급한다.


JS function의 특징들

함수 정의 방식
아래 두 함수 정의 방식은 완전히 동일하다.
아래 두 함수 정의 방식은 (동작 방식은 다르지만) 동작 결과는 완전히 동일하다 (댓글 주신 @지돌스타님 감사합니다).

1. 변수에 익명함수(anonymous function)를 assign
var myFunc = function(a, b, c) {
    return a+ b+ c;
}

2. Named function을 정의
function myFunc(a, b, c) {
    return a+ b+ c;
}

자바스크립트는 변수의 타입을 느슨하게 규정한다. 따라서,
- 함수 인자를 정의할 때 타입을 지정할 필요가 없다.
- 함수의 리턴 타입을 지정할 필요가 없다.

함수 취급 방식 (1st class function)
함수 및 함수 코드 블럭을 객체처럼 (객체와 동일하게) 취급한다. 즉, 함수를 인자나 리턴으로 사용할 수 있다
/* 함수를 배열 item 데이터로 사용 */
var operators = {
    add:    function(x, y) { return x+ y; },
    sub:    function(x, y) { return x- y; }
};
alert( operators['add'](1, 3) ); //'4' 팝업
alert( operators['sub'](3, 1) ); //'2' 팝업

/* 함수를 다른 함수의 인자로 사용 */
var add;
function setAdd(code) {
    add = code;
}
setAdd(function(x, y) { return x+ y; }); //함수 코드 블럭을 다른 함수의 인자로 전달
alert( add(1, 2) ); //'3' 팝업

/* 함수를 리턴 값으로 사용 */ 
function getAddFunc() {
    return function(x, y) { return x+ y; }
}
var add = getAddFunc();
alert( add(1, 2) ); //'3' 팝업

/* 함수를 선언과 함께 호출 */
alert ( (function(x, y) { return x+ y; })(1, 2) ); //'3'을 팝업

변수 Scope
변수의 참조 Scope는 블럭 ({...}) 단위가 아니라 함수 단위로 결정된다.

function outerFunc() {
    var a = 'hello';
    function innerFunc() {
        alert(a); //innerFunc()이 호출되면 outerFunc()의 a 변수를 참조하여 'hello' 팝업
    }
    innerFunc();
}
outerFunc();

(이상)
PS. 글을 긁어갈 때는 출처를 밝혀 주면 좋겠다. 인터넷 검색중에 출처에 대한 언급 없이 내 글이 걸려 있는 것을 보면 기분이 안좋다. 출처를 명시하고, 원본을 수정하지 않고, 상업적 용도로 사용하지 않는 이상, 본 블로그의 글은 자유롭게 사용할 수 있다.


Posted by ingee

댓글을 달아 주세요

  1. 지돌스타 2012.01.16 10:29 신고  댓글주소  수정/삭제  댓글쓰기

    글 잘보고 갑니다.
    내용중에 함수부분 설명이 잘못된 것 같아서요.
    함수에는 함수 선언문과 함수 표현식이 있는데
    function name() {} 형태는 함수 선언문이고 이것이 아닌 것은 전부 함수 표현식입니다.
    a = function() {};
    a = function a() {};
    (function a() {})();
    (function (){});
    함수 선언문의 경우 자바스크립트 인터프리터가 바로 해석해버립니다. 함수 선언문의 호이스팅이라고 하는데... 다음과 같은게 가능해집니다.

    func(); //호출됨
    function func() {
    }

    하지만 함수 표현식의 경우에는 안됩니다.
    a(); //에러!
    a = function () {
    };

    이것은 인터프리터가 a에 할당하는 function의 정의부를 실행타임에 해석한다는 의미입니다.
    그러므로 함수 선언과 함수 표현은 명백히 다르게 해석하고 동작하므로 주의해야합니다.

    함수 선언이 좋은 것 같지만 인터프리터가 정의를 실행하기 전에 전부 해석해버리므로 너무 많으면 코드가 늦게 시작되는 문제가 발생합니다. 그러므로 함수 선언문과 함수 표현식을 적절히 섞어 쓰는게 좋습니다.

    • ingee 2012.01.16 11:42 신고  댓글주소  수정/삭제

      "함수 선언이 좋은 것 같지만 인터프리터가 정의를 실행하기 전에 전부 해석해버리므로 너무 많으면 코드가 늦게 시작되는 문제가 발생합니다."... 와, 이거 멋진 지적이군요. 좋은 설명 감사드립니다.

  2. 지돌스타 2012.01.16 10:33 신고  댓글주소  수정/삭제  댓글쓰기

    함수 정의하는 형태는 new Function()처럼 하는 경우도 있는데 객체 생성방법으로 하는 형태입니다. function은 키워드이고 Function은 함수 이름입니다. Object, Array와 같은거죠. 그러므로 자바스크립트는 두개를 다르게 해석합니다. 동작도 다른데 new Function으로 생성된 함수 객체를 호출하면 eval()함수를 호출하는 것과 같습니다. eval은 컨텍스트 및 스코프 관리가 어려워지므로 왠만하면 사용하지 않는 것이 좋겠습니다. 결국 new Function도 사용하지 않는게 좋겠죠. 참고로 new Function이든 그냥 Function이든 동일하게 동작합니다.

    • 지돌스타 2012.01.16 18:07 신고  댓글주소  수정/삭제

      자바스크립트 해석기가 function과 Function을 어떻게 바라볼 것인가에 초점이 맞춰져야 합니다. function은 인터프리터가 그대로 해석합니다. 하지만 Function은 인스턴스로 만들어넣고서 실제로 실행하면 eval이 실행되는 것과 동일합니다. 동작방식 자체가 다릅니다. ^^