캔버스 위조 -이 기능을 사용할 수 있습니까?

Question

저는이 가짜 캔버스를 모든 라인, 커브 및 moveTo의 사후 처리를위한 임의의 프레임 워크로 넘기려는 의도로 캔버스를 "가짜"로 만들려고합니다.

이 코드를 관리하려면 실제로이 코드를 사용해 보았습니다.하지만이 행운의 장면에서 얼마나 많은 행운이 있었는지 알고 싶습니다.

(function(){ 
    function DebugCanvas(){ 
     this._dom = document.createElement('canvas'); 
     addPropertiesToObject.call(this, this._dom); 
     this._fakeContext = null; 
    } 

    Object.defineProperties(DebugCanvas.prototype, 
    { 
     'constructor' : { 
      'value' : DebugCanvas, 
      'enumerable' : true 
     }, 

     'getContext' : { 
      'value' : function(which){ 
       var ctx; 
       if(which == '2d'){ 
        if(this._fakeContext == null){ 
         this._fakeContext = new FakeContext(this._dom); 
        } 
        ctx = this._fakeContext; 
       } else { 
        ctx = this._dom.getContext(which); 
       } 
       return ctx; 
      }, 
      'enumerable' : true 
     } 
    } 
); 

function FakeContext(debugCanvas){ 
    this._debugCanvas = debugCanvas; 
    this._realContext = debugCanvas._dom.getContext('2d'); 
    addPropertiesToObject.call(this, this._realContext); 
} 

Object.defineProperties(FakeContext.prototype, { 
    'toString' : { 
     'value' : function(){ 
      return '[Object FakeContext]'; 
     }, 
     'enumerable' : true 
    }, 

    'canvas' : { 
     'get' : function(){ 
      return this._debugCanvas; 
     }, 
     'set' : function(c){ return }, 
     'enumerable' : true 
    } 
}); 

function addPropertiesToObject(from){ 
    var description, obj; 

    for(var prop in from){ 
     obj = from; 
     do { 
      if(obj.hasOwnProperty(prop) && 
       !this.constructor.prototype.hasOwnProperty(prop)){ 

       try{ 
        description = Object.getOwnPropertyDescriptor(obj, prop); 
        Object.defineProperty(this.constructor.prototype, prop, description); 
       } catch(err){ 
        this[ prop ] = from[ prop ]; 
       } 
       break; 
      } 
     } while(obj = Object.getPrototypeOf(obj)); 
    } 
}; 
})() 

기본적인 아이디어는 멀리있는 그대로 캔버스 (모든 체인 위쪽), 컨텍스트 '와 context.prototypes'가짜 객체의 프로토 타입 속성 ', canvas.prototypes'을 모두 복사하는 것입니다 아직 거기에 존재하지 않습니다.

Answer 1

자바 스크립트에서는 원본과 동일한 속성/방법으로 대체 개체를 자유롭게 구성 할 수 있으며 원본 대신 사용할 수 있습니다. 메서드 호출 또는 속성 액세스는 어느 쪽이든 같고 호출 코드는 일반적으로 차이를 알 수 없습니다. 이것은 자바 스크립트에서 때때로 할 매우 유용한 일이 될 수 있습니다.

이렇게 복잡한 대체 부분은 모든 메서드와 속성의 실제 동작을 에뮬레이트하여 원하는 코드를 전달하는 코드입니다. 그러나 성공적으로 수행 할 수 있다면 정상적으로 작동합니다. 행운은 관련이 없습니다 - 메서드/속성의 에뮬레이션이 옳다면이 기능이 작동해야합니다.