Rev. 2.73

Prototype 분석 - Prototype오브젝트

이것 자체의 기능은 별 일 없습니다만, 보아서 익숙하지 않으면 무엇을 하고 있는지 이해하기 어렵습니다.이 기법에는 몇개의 전제가 있습니다.

배열(커스텀 오브젝트) 기법
이하의 3개는 거의 같은 의미입니다.

var obj = {name1:value1, name:value2, ...};

var obj = new Object();
obj["name1"] = value1;
obj["name2"] = value2;
 :
 :

var obj = new Object();
obj.name1 = value1;
obj.name2 = value2;
 :
 :

무명함수

function name1(arg){
 :
 : 
}
var name2 = name1;

var name2 = function name1(arg){
 :
 :
}

name2로 액세스 하는 것이 정해져 있다면, name1는 불필요합니다.

var name2 = function(arg){
 :
 :
}

이 function(arg){}와 같이 이름이 없는 함수를 무명 함수라고 합니다.

따라서, 이하와 같이 동작합니다.

alert(Prototype.Version);         //'1.4.0'라고 표시된다.
alert(Prototype.ScriptFragment);  //'(?:<script.*?>)((
                                  // |
                                  // |.)*?)(?:<\/script>)'라고 표시된다.(\n와\r는 개행이 된다)
alert(Prototype.emptyFunction()); //'undefined'라고 표시된다.(아무것도 반환하지 않기 때문에)
alert(Prototype.K("test"));       //'test'라고 표시된다.

Comments

Prototype 분석 - Class오브젝트

create 메서드는, 자오브젝트의 initialize 메서드를 호출하는 무명함수를 반환합니다.즉, 이하의 2개는 같은 의미입니다.

var Test = Class.create();

var Test = function() {
  this.initialize.apply(this, arguments);
}

initialize 메서드는 개별적으로 추가할 필요가 있습니다.구체적으로는 이하와 같이 합니다.

var Test = Class.create();
Test.prototype = {
  initialize : function(arg){
    :
    :
  }
}

이것을 참고 사이트 「객체 지향 프로그램 언어로서의 JavaScript」의 기법에 맞추면(자) 이하가 됩니다.

function Test(){
  this.initialize.apply(this, arguments);
}
function Test_initialize(arg){
  :
  :
}
Test.prototype.initialize = Test_initialize;

constructor 인Test 함수가 initialize 메서드에 처리를 환 던지고 하고 있는 것은, 후술 하는 클래스 계승시에 프롭퍼티도 계승시키기 (위해)때문에라고 생각됩니다.(상기 기법에서는 Test 함수내의 프롭퍼티는 계승되지 않는다)

왜 apply()가 사용될까
this.initialize.apply(this, arguments); 의 대체로의 의미는, 「자오브젝트의 initialize 메서드를 호출한다.자오브젝트의 프롭퍼티·메서드를 사용해, 호출원으로부터의인수를 그대로 인수로 한다.」가 됩니다.다만, 자오브젝트의 메서드가, 자오브젝트의 프롭퍼티·메서드를 사용할 수 있는 것은 분명해, 어쩐지 무의미한 지정으로 보입니다.

실제, 제일 인수의 부분은 무의미라고 생각합니다. 이 경우, 중요한 것은 제2 인수 쪽입니다.arguments로 취득한 인수의 배열을, 그대로 함수의 호출에 사용할 수 있기 때문입니다. 이하는 apply()를 사용하지 않았던 경우입니다.

var Class = {
  create: function() {
    return function() {
      //apply()를 사용하지 않고 initialize 메서드를 호출하면(자)···
      this.initialize(arguments); 
    }
  }
}
var Test = Class.create();
Test.prototype = {
  initialize: function(msg) {
    //"[object Object]"라고 표시된다.
    alert(msg);
    
    //"hello!"라고 표시된다.
    alert(msg[0]); 
  }
}
var test = new Test("hello!");

Comments

Prototype 분석 - Object 클래스 확장

기존의 Object 클래스에 메서드를 2개 추가하고 있습니다.

extend 메서드
제2인수의 오브젝트의 프롭퍼티 모든 것을, 제일 인수의 오브젝트에 추가 또는 덧쓰기해, 그것을 반환하고 있습니다. prototype.js에서는 클래스의 계승에 자주(잘) 이용되고 있습니다.이하와 같이 합니다.

Object.extend(subClass.prototype, superClass.prototype);

inspect 메서드
undefined는 값이 미정도리라고 하는 의미입니다.다만, undefined와 null는 거의 동일 취급이라고 생각되어 실제로'null'가 표시될 것은 없는 생각이 듭니다.(IE, NC,FireFox,Opera로 확인)

var testUndefined;
var testNull = null;
alert(Object.inspect(testUndefined)); //'undefined'가 표시된다
alert(Object.inspect(testNull)); //'undefined'가 표시된다
//(참고) alert로 표시했을 경우
alert(testUndefined); //'undefined'가 표시된다
alert(testNull); //'null'가 표시된다

Object.inspect의 5행째로, 인수 오브젝트에 inspect 메서드가 있으면 그것을 호출해, 없으면 toString 메서드를 호출해 반환치를 그대로 반환하고 있습니다.조건 연산자(조건식 ? a : b)는 향후 빈출 합니다.조건식이 변수만의 경우, null(undefined)로 false, null(undefined) 이외로 true를 의미합니다.

이상의 처리중에 발생한 에러를 try...catch문으로 포착하고 있습니다.instanceof 연산자로 에러 오브젝트 e가 RangeError인지 판정합니다.RangeError이면'...'를 반환합니다.그 이외는 에러 오브젝트를 그대로 슬로우 하고 있습니다.

RangeError는 NativeError 오브젝트의 하나로, 범위외 에러를 취급하기 위한 에러 오브젝트입니다.(참고：404 Error - Not Found) 그러나, 이 경우 어떤 풀어에 발생하는지는 잘 모릅니다···

클래스에 고유의 메서드
상기의 메서드는 Object.extend와 같이 정의되고 있기 (위해)때문에, 클래스에 고유의 메서드가 되어,인스턴스나 서브 클래스에는 갖춰지지 않습니다.(Object.prototyep.extend와 같이 정의되면 인스턴스나 서브 클래스에도 갖춰집니다)

alert(Object.extend); //코드가 표시된다
var object = new Object();
alert(object.extend); //undefined라고 표시된다

Comments