文章/答案/技术大牛

发布

问方法不知道类字段
EN

Stack Overflow用户

提问于 2017-10-30 15:00:11

回答 2查看 38关注 0票数 0

我的代码有一个严重的问题。我有一座建筑，它的水平可以通过点击“改进”按钮来提高。按钮是在构造函数中创建的。当我用按钮调用函数时，我会收到一条错误消息，它告诉我"this.price“是未定义的。如果我通过在代码中编写这个函数来调用它，那么"this.price“就是已知的。我该如何解决这个问题？

<html>
	<body>
		<span id="buildings"></span>
		<script>
			var cookies = 0;
			var cookies_produced = 0;
			var altogether_productivity = 0; // counts productivity of buildings except clicker
			
			var cookies_display = document.getElementById("cookies");
			var cookies_produced_display = document.getElementById("cookies_produced");
			
			var buildings = document.getElementById("buildings");
			
			class Building
			{
				constructor(name, productivity, price)
				{
					this.name = name;
					this.level = 0;
					this.price = price;
					this.productivity = productivity;
			
					// variables for displaying
					// definition of areas
					this.area = document.createElement("span");
					this.area.id = name;
			
					this.level_display = document.createElement("span");
					this.level_display.id = this.name + "_level";
			
					this.productivity_display = document.createElement("span");
					this.productivity_display.id = this.name + "_productivity";
			
					this.price_display = document.createElement("span");
					this.price_display.id = this.name + "_price";
			
					this.button = document.createElement("button");
					this.button.innerHTML = "Improve";
			        this.button.onclick = this.improve;
			
					// put together
					this.area.append(document.createTextNode(name + " Level: "));
					this.area.append(this.level_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(document.createTextNode("Cookies per Second: "));
					this.area.append(this.productivity_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(document.createTextNode("Improvement Price: "));
					this.area.append(this.price_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(this.button);
					this.area.append(document.createElement("br"));
					this.area.append(document.createElement("br"));
				}
				
			    improve()
			    {
			        console.log("cookies" + cookies);
			        console.log(this.price);
			        if(cookies >= this.price)
			        {
			            cookies -= this.price;
			            this.level += 1;
			            this.price *= 2;
			            altogether_productivity += this.productivity;
			        }
			        else
			        {
			            alert("Not enough cookies!");
			        }
			    }
			
				renew_display()
				{
					this.level_display.innerHTML = this.level;
					this.productivity_display.innerHTML = this.get_production_value();
					this.price_display.innerHTML = this.price;
				}
			
			
				set_visible()
				{
					buildings.append(this.area);
					this.renew_display();
				}
			
				get_production_value()
				{
					return this.level * this.productivity;
				}
			
				produce()
				{
					cookies += this.get_production_value();
				}
			}

			var building = new Building("Building", 5, 1000)
			building.set_visible();
			building.improve();
		</script>
	</body>
</html>

javascript

class

onclick

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-10-30 15:12:01

问题

您的函数improve是，而不是与类在同一个作用域中的。

在JavaScript中，函数是对象，"this“的值取决于函数的调用方式。有一个相关的问题关于JavaScript的this和Java的this。

您可以阅读更多关于JavaScript的this 这里的信息。

解决方案

我建议您将this绑定到improve，如下所示：

this.improve = this.improve.bind(this);

bind(param)的工作方式是在调用时创建一个新函数，将this设置为param。您可以阅读更多关于它的这里。

票数 2

Stack Overflow用户

发布于 2017-10-30 15:08:07

在构造函数中添加以下一行：this.improve = this.improve.bind(this);。这种情况之所以发生，是因为界定了范围。单击improve方法中的事件后，improve方法中包含实际单击事件，而不是Building类的this

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47018397

复制

相似问题

问方法不知道类字段
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问方法不知道类字段EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问方法不知道类字段
EN