간단한 객체 지향 자바스크립트 simple object oriented javascript 에 이어집니다.

지난 번 함수에 파라미터는 어떻게 전달할까요. onclick="issue.view('kenu')" 이렇게 말이죠.
<script type="text/javascript">
  var issue = {
    view : function(name) {
      alert(name + "! Let's see.");
    }
  };
</script>
<input type="button" value="check it out" onclick="issue.view('kenu')">

name 이라는 파라미터 전달 방식입니다. 설명하기 애매하지만 그냥 () 괄호 안에 쓰면 됩니다.

issue.open() 이라는 것을 만들어 볼까요.
<input type="button" value="open it" onclick="issue.open('kenu')">
이라고 추가할 수 있겠죠. 코드는 다음과 같아 집니다.

<script type="text/javascript">
  var issue = {
    view : function(name) {
      alert(name + "! Let's see.");
    },
    open : function(name) {
      alert(name + "! Open it, please.");
    }

  };
</script>
<input type="button" value="check it out" onclick="issue.view('kenu')">
<input type="button" value="open it" onclick="issue.open('kenu')">

view : function {} 다음에 오는 콤마(,) 이후에 view와 같은 형식의 open function을 만들면 됩니다. 두 개 만드는 법을 알았으니 3, 4, 5 계속 추가할 수 있겠죠.

 
자바스크립트 이야기입니다. 웹2.0이 뜨고나서, 특히 Ajax라고 불리면서 현란하게 브라우저를 수놓는 시대에 와서 가장 진보적인 위치를 차지하고 있는 것이 자바스크립트입니다. 자바에다가 스크립트를 붙이면 정말 다른 언어가 됩니다. 물론 베이직 언어와 달리 대소문자를 칼같이 지켜야 되는 점은 자바와 같지만, 컴파일이나 실행방식, 문법 구조 같은 언어적 특성이 자바와 많이, 아주 많이 다릅니다.

웹2.0을 전후로 자바스크립트 내에서도 큰 변화가 생겼습니다. 그 전에는 베껴쓰는 자바라 하여 컴퓨터 랭귀지 취급도 받지 못했습니다. "그거 아무나 하는거야 그냥 검색해서 찾아서 베껴쓰면 되잖아"라는 인식이 팽배했습니다. 물론 접근하기 쉽다는 인식도 있지만, 자바스크립트 언어의 진면목을 세상이 몰라 주었던 것이죠.

구글맵으로 세상이 들썩거리고 자바스크립트의 객체지향성을 일깨워 준 프레임워크가 나왔습니다. 미운 오리 새끼가 백조가 될 수 있는 가능성을 보여준 것이죠. 바로 prototype.js 입니다. 이것을 바탕으로 해서 많은 자바스크립트 프레임워크와 라이브러리들이 쏟아지기 시작했습니다.
기존에는 거의 팁으로만 취급받던 것들이 소프트웨어 제품으로 인정을 받기 시작했죠. 초창기에 script.aculo.us, rico, dojo 등이 선보였고, YUI(Yahoo UI) 같이 큰 포털에서 내어놓은 것도 있었습니다. 자바스크립트의 르네상스라고 해도 될지요. DHTML로 살짝 떴다가 내려갔는데, 이 때는 정말 부흥이 맞습니다. 아직도 지속되고 있구요.


허무할지 모르지만 그 유치했던 자바스크립트에서 이런 표현이 가능합니다.

<script type="text/javascript">
  var issue = {
    view : function() {
      alert("Let's see.");
    }
  };
</script>
<input type="button" value="check it out" onclick="issue.view()">

어떤 의미인지 설명하지 않아도 되겠죠. 하나 유념할 것은 issue에 종속된 view()라는 것입니다 그냥 view() 호출하면 안됩니다. 이렇게 scope를 주는 것이 의미가 있게 됩니다.

+ Recent posts