无法读取属性'x'的undefined

Question

所以我一直在试图把一个简单的基于文本的简单RPG放在一起，我刚刚完成了为按钮和不同类型的字符创建对象。当我停下来休息一天并保存时，我没有任何错误，但是我今天又回来了，并收到错误“Can not read property'x'of undefined。”该错误没有列出任何代码行，并且除此之外我没有列出任何错误。我只有在按钮对象使用“X”，所以我认为这个问题是在这个代码块的地方：

//selection buttons 
 
var Button = function(config) { 
 
    this.x = config.x || 5; 
 
    this.y = config.y || 2; 
 
    this.width = config.width || 390; 
 
    this.height = config.height || 96; 
 
    this.vrtx = config.vrtx || 50; //curve on the corners 
 
    this.lable = config.lable || "Click Here"; 
 
    this.r = config.r || 100; 
 
    this.b = config.b || 100; 
 
    this.g = config.g || 100; 
 
}; 
 

 
Button.prototype.draw = function() { 
 
    strokeWeight(5); 
 
    stroke(this.r/2, this.b/2, this.g/2); 
 
    fill(this.r, this.b, this.g); 
 
    rect(this.x, this.y, this.width, this.height, this.vrtx); 
 
    fill(0, 0, 0); 
 
    textSize(27); 
 
    textAlign(LEFT, TOP); 
 
    text(this.label, this.x + 10, this.y + this.height/4); 
 
}; 
 

 
var btn1 = new Button(/*customize button*/);

只是柜面它不是在这一节中，在这里，我的代码的其余部分：

//classes 
 
var mage; 
 
var warrior; 
 
var rogue; 
 
var cleric; 
 
//stats 
 
var manaLvl; 
 
var strengthLvl; 
 
var stealthLvl; 
 
var xpLvl = 10; 
 
var enemyCount = 0; //# of enemies defeted 
 
var lvl; //player's level 
 

 
//player stats and level up 
 
var character = function(health, armour, packSize, packItems, mana, strength, stealth, xp) { 
 
    this.health = health; 
 
    this.defArmour = armour; 
 
    this.packSize = packSize; 
 
    this.packItems = packItems; 
 
    this.mana = mana; 
 
    this.strength = strength; 
 
    this.stealth = stealth; 
 
    this.xp = xp; 
 
}; 
 

 
Character.prototype.lvlUp = function() { 
 
    this.health += 2; 
 
    this.packSize += 1; 
 
    this.mana += manaLvl; 
 
    this.strength += strengthLvl; 
 
    this.stealth += stealthLvl; 
 
    enemyCount = 0; 
 
}; 
 

 
character.prototype.xpGain = function() { 
 
    this.xp = enemyCount * xpLvl; 
 
    if (this.xp === 100) { 
 
    character.lvlUp(); 
 
    } 
 
}; 
 

 
character.prototype.packStorage = function() { 
 
    if (this.packItems < this.packSize) { 
 
    //allow player to store items 
 
    } 
 
}; 
 

 
//selection buttons 
 
var Button = function(config) { 
 
    this.x = config.x || 5; 
 
    this.y = config.y || 2; 
 
    this.width = config.width || 390; 
 
    this.height = config.height || 96; 
 
    this.vrtx = config.vrtx || 50; //curve on the corners 
 
    this.lable = config.lable || "Click Here"; 
 
    this.r = config.r || 100; 
 
    this.b = config.b || 100; 
 
    this.g = config.g || 100; 
 
}; 
 

 
Button.prototype.draw = function() { 
 
    strokeWeight(5); 
 
    stroke(this.r/2, this.b/2, this.g/2); 
 
    fill(this.r, this.b, this.g); 
 
    rect(this.x, this.y, this.width, this.height, this.vrtx); 
 
    fill(0, 0, 0); 
 
    textSize(27); 
 
    textAlign(LEFT, TOP); 
 
    text(this.label, this.x + 10, this.y + this.height/4); 
 
}; 
 

 
var btn1 = new Button(/*customize button*/); 
 

 
//class selection 
 
if (mage === true) { 
 
    var lvl = new character(10, 5, 10, 20, 5, 5); 
 
    manaLvl = 3; 
 
    strengthLvl = 1; 
 
    stealthLvl = 1; 
 
} else if (warrior === true) { 
 
    var lvl = new character(20, 20, 5, 20, 5, 5); 
 
    manaLvl = 1; 
 
    strengthLvl = 3; 
 
    stealthLvl = 1; 
 
} else if (rogue === true) { 
 
    var lvl = new character(15, 10, 10, 20, 5, 5); 
 
    manaLvl = 1; 
 
    strengthLvl = 2; 
 
    stealthLvl = 2; 
 
} else if (cleric === true) { 
 
    var lvl = new character(15, 10, 15, 5, 10, 15); 
 
    manaLvl = 2; 
 
    strengthLvl = 2; 
 
    stealthLvl = 1; 
 
} 
 

 
var draw = function() { 
 
    btn1.draw(); 
 
};

如果有人知道是什么问题是我会非常感谢你的帮助！

Answer 1

当你调用

var btn1 = new Button(/*customize button*/);

Button应该被送去配置的值。因为这不存在，所以当您尝试访问config.x时，您会收到错误消息。

为了解决需要相关的数据发送给Button如问题：

var btn1 = new Button({x : 1, y : 2}); //等