如何在Javascript中更改函数内部变量的值？

我正在尝试用Javascript做更多的OOP。 有一件事我搞不清楚，那就是如何从另一个函数中修改对象内部的变量

下面是我如何尝试的：

function Ball(){
    radius = 5;
    Y = 20;
    X = 25; // The value i would like to change.
    ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
    ctx.fillStyle = '#00ff00';
    ctx.fill();
}

function draw(){
    Player();
    Ball();
}

function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    Ball.X++;  // This is where i want to modify the value.

}

到目前为止，我只能将X定义为全局变量，但我不想这样做，因为还有其他X和Y值

那么如何从函数外部访问变量呢

编辑： “nnnn”提供的解决方案在一定程度上起了作用，它改变了X值，但我遇到了另一个问题。 我的clearRect不会清除动画，因此它会绘制一条刚刚增长的线，而不是一个球

这就是代码现在的样子：

function Ball(){
    this.radius = 5;
    this.Y = 20;
    this.X = 25;
    this.draw = function() {
       ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
       ctx.fillStyle = '#00ff00';
       ctx.fill();
    };
}

var ball = new Ball();

function draw(){
    Player();
    ball.draw();
}


function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    ball.X++;
}

我尝试过移动它，将它放在draw（）和ball.draw（）函数中，但仍然得到相同的结果，我也尝试过使用fillRect而不是clear，但没有效果。

---

任何人都能看到有什么问题吗？

在Ball函数中，使用

this.X=25。然后，当您实例化Ball时，您可以

var ball = new Ball();
ball.X++;

更多信息如下：。
创建Ball类型的实例，使用其引用修改实例变量

function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    var objBall = new Ball();
    objBall.X++
}

有几种方法可以做到这一点。首先，您可以使用constructor方法，在要在外部使用的变量前面添加
this
关键字。像这样：

function Ball(){
  this.radius = 5;
  this.Y = 20;
  this.X = 25; // The way you wanted.

  ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
  ctx.fillStyle = '#00ff00';
  ctx.fill();
}

//call it like this 
Ball.X;
Ball.Y;
Ball.radius;

//or inside an assigned variable which is instantiated with 'new' keyword:
var myVar = new Ball(); 
myVar.X;
myVar.Y;
myVar.radius;

或者使用对象表示法，如下所示：

var Ball = {
  radius: 5,
  Y: 20,
  X: 25,

  someFunction: function() {
    //Even in here use 'this' to refer to any property of the object 'Ball', like this:
    var product = this.radius * this.X;

    return product + this.Y
  }

};

//call it also this way
Ball.X;

//or
Ball.radius;

//or
Ball.someFunction();

function Ball(){
    this.radius = 5;
    this.Y = 20;
    this.X = 25;
    this.draw = function() {
       ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
       ctx.fillStyle = '#00ff00';
       ctx.fill();
    };
}

var ball = new Ball();

function draw(){
    Player();
    ball.draw();
}

function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    ball.X++;
}

现在可以在任何地方使用它：

function update(){
  //Now you can use it anywhere
  var smallBall = new Ball();
  smallBall.X++;
}

因此，如果要使属性属于某个对象，请在构造函数中使用
this
，或者只使用对象表示法。您对技术的选择取决于您希望在项目中做什么。
此外，如果要隐藏对象中的任何属性（即变量、函数等），请使用
var
关键字，使该属性不会是全局的
 “到目前为止，只有将X定义为全局变量时，我才能做到这一点”

实际上，您的变量
radius
，
X
和
Y
都是全局变量。要使其成为对象的属性，需要按如下方式设置：

someObject.radius = 5;
// OR
someObject["radius"] = 5;

var ball = new Ball();
alert(ball.X); // 25
ball.X++;

它们不是
Ball（）
函数中的局部变量，因为它们不是用
var
声明的-任何分配值而不使用
var
声明的变量都会自动变为全局变量

调用
Ball（）
函数时，该函数没有创建对象-为此，需要使用
new
：

var ball = new Ball();

如果您使用
new
调用它，那么JS会自动创建
Ball
的一个新实例，并且在函数
中，此
引用该新实例。所以函数应该说：

function Ball(){
    this.radius = 5;
    this.Y = 20;
    this.X = 25; // The value i would like to change.
    ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
    ctx.fillStyle = '#00ff00';
    ctx.fill();
}

然后，您可以按如下方式访问和更改属性：

someObject.radius = 5;
// OR
someObject["radius"] = 5;

var ball = new Ball();
alert(ball.X); // 25
ball.X++;

但是，这并不符合您构建代码的方式，因为您试图调用
Ball（）
，让它自己绘制。你可能想要更像这样的东西：

var Ball = {
  radius: 5,
  Y: 20,
  X: 25,

  someFunction: function() {
    //Even in here use 'this' to refer to any property of the object 'Ball', like this:
    var product = this.radius * this.X;

    return product + this.Y
  }

};

//call it also this way
Ball.X;

//or
Ball.radius;

//or
Ball.someFunction();

function Ball(){
    this.radius = 5;
    this.Y = 20;
    this.X = 25;
    this.draw = function() {
       ctx.arc(this.X, this.Y, this.radius, 0, Math.PI*2, true);
       ctx.fillStyle = '#00ff00';
       ctx.fill();
    };
}

var ball = new Ball();

function draw(){
    Player();
    ball.draw();
}

function update(){
    ctx.clearRect(0, 0, 800, 400);
    draw();
    ball.X++;
}

没有什么不好的感觉，但我宁愿在跑步之前先学会走路。您的代码看起来不太雄心勃勃。你不是在处理一个实例/对象，你只是在一个函数中有变量（甚至不是局部变量）。是的，它们过去是这个.X和这个.Y等，但由于它们是局部的，我试图使em全局可变：d这需要一个
this.X=25在
球中
谢谢，成功了：）。我之前也试过类似的方法，但没能成功。不过我仍然有一个问题，clearRect不起作用，所以它不是一个5半径的球，而是画了一条越来越长的线。我应该把我的clearRect放在哪里？我不确定-我想如果你总是在
update（）
函数中的
draw（）
之前调用
.clearRect（）
。你能给我发个演示吗？