オブジェクト変数は定義されていません

Question

私はoopの概念に新しいので、ここで助けてください 私はオブジェクト変数を使用しているときはいつでも、それに格納されている値は未定義です。 ではなくvarの以下のコード

---

function Bubble(q, w, e) { 
    var x= q; 
    var y= w; 
    var r = e; 
    var canvas= document.getElementById('mycanvas'); 
    var ctx = canvas.getContext('2d'); 

    ctx.beginPath(); 
    ctx.arc(x,y,r,0,2*Math.PI); 
    ctx.stroke(); 
} 

var b1 = new Bubble(100,100,50); 
var b2 = new Bubble(160,160,30); 
alert(b1.x);  

Answer 1

使用thisを確認してください。 varを使用すると、function scopeでアクセス可能なスコープ付き変数を作成し、this変数を現在のコンテキストに添付します。接頭辞がthis.のx, y, rを参照してください。

function Bubble(q,w,e) 
 
{ 
 
    this.x = q; 
 
    this.y = w; 
 
    this.r = e; 
 
    var canvas = document.getElementById('mycanvas'); 
 
    var ctx = canvas.getContext('2d'); 
 
    
 
    ctx.beginPath(); 
 
    ctx.arc(this.x, this.y, this.r, 0, 2*Math.PI); 
 
    ctx.stroke(); 
 
} 
 

 
var b1 = new Bubble(100,100,50); 
 
var b2 = new Bubble(160,160,30); 
 
alert(b1.x);

<canvas id="mycanvas"></canvas>

Answer 2

バブルのプロパティは外のxにアクセスするには、thisを使用してみて、あなたがそれを追加するまでは、変数xにアクセスすることはできません。あなたの例では、xはプライベート変数であり、それにアクセスすることはできません

function Bubble(q,w,e) 
{ 
    this.x= q; 
    this.y= w; 
    this.r = e; 
    this.canvas= document.getElementById('mycanvas'); 
    var ctx = canvas.getContext('2d'); 

    ctx.beginPath(); 
    ctx.arc(this.x, this.y, this.r,0,2*Math.PI); 
    ctx.stroke(); 
    } 
    var b1 = new Bubble(100,100,50); 
    var b2 = new Bubble(160,160,30); 
    alert(b1.x);