的Javascript：複製變量和原型

好了，JavaScript是一種「原型」的語言，這在我的理解意味着它有這樣的事情：的Javascript：複製變量和原型

var c = document.getElementById('myCanvas'); 
c.ctx = c.getContext('2d');

現在，如果我這樣做：

var c = document.getElementById('myCanvas'); 
c.ctx = c.getContext('2d'); 
c = document.getElementById('newCanvas');

在影響全新的畫布時，c.ctx是否會保持功能並保持功能？謝謝！

我的實驗說不，但我問，因爲也許我錯過了一些東西。如果理論上這不應該起作用，你有沒有什麼好辦法可以相對容易地解決它？（或不那麼容易，但容易是當然的喜好！）

來源

2013-10-20 J S

不，因爲您重新定義變量。 –

你的意思是「在影響全新的畫布時保持並保持功能？」，只要包含c.ctx的函數在範圍內，就會定義c.ctx。 – Nikola

儘量不要將JavaScript與DOM混合使用。他們是兩個完全不同的東西。你沒有在代碼中的任何地方使用原型。你所要做的就是在一個變量'c'中獲得一個DOM元素，給它賦一個屬性，然後將變量'c'重新賦值給另一個DOM元素。代碼中沒有繼承。爲了準確理解什麼是原型繼承，我建議你閱讀[爲什麼原型繼承很重要]（http://aaditmshah.github.io/why-prototypal-inheritance-matters「Aadit M Shah |爲什麼原型繼承很重要」）。 –

當你分配這樣的：

c = document.getElementById('newCanvas');

您正在使用一個新的對象的引用替換整個c變量。以前的c對象以前的屬性將不會保留。

來源

2013-10-20 02:35:14 jfriend00

在你的代碼

var c = document.getElementById('myCanvas'); 
c.ctx = c.getContext('2d'); 
c = document.getElementById('newCanvas');

在最後一行，你只是覆蓋C變量。

你可以把它看作運行此

var c = document.getElementById('myCanvas'); 
c.ctx = c.getContext('2d'); 
c = 3;

假設你寫的實際上意味着什麼代碼：你很幸運，雖然，一個CTX具有內置的畫布引用（這是什麼的對面你想要的，但它同樣處理）

ctx.canvas;

來源

2013-10-20 02:35:30 Azeirah

威爾c.ctx保留，而影響了一個全新的畫布是功能？

不，你正在爲c創建一個全新的參考。

所以JavaScript是一種 '原型' 語言

爲什麼不定義你的原型然後想要什麼？

Object.defineProperty(
    HTMLCanvasElement.prototype, 
    'ctx', 
    { 
     'get': function() { return this.getContext('2d'); }, 
     'configurable': true 
    } 
);

訪問時，雖然他們的DOM接口將有一個屬性 CTX這得到其上下文

現在所有<canvas>元素。

如果你高興的背景被緩存，你可以用這個代替

function() { return this.ctx = this.getContext('2d'); }

它設置在其陰影原型的getter實例的新屬性。

來源

2013-10-20 02:40:42

聰明！我想知道每次訪問「ctx」時不得不調用'getContext'的開銷是多少。 –

我不確定多個「上下文」是如何工作的，但你總是可以做'return this.ctx = this.getContext（'2d'）;'所以你緩存它，而是 –

的Javascript：複製變量和原型

回答

相關問題