[英]How to assign object properties to the result of an XMLHTTP Request
I'm writing a Reversi engine and I want to be able to fetch the opening book from a file on the server and then assign this as an array to the 'openings' property of the Reversi class.我正在编写 Reversi 引擎,我希望能够从服务器上的文件中获取开头的书,然后将其作为数组分配给 Reversi 类的“openings”属性。 At the moment I have assigned it to the 'openings' property of the reversi object, which is the (only) instance of the Reversi class.目前,我已将其分配给黑白棋对象的 'openings' 属性,它是黑白棋类的(唯一)实例。 However, I feel as though this is a bad solution and a better one must exist.但是,我觉得这是一个糟糕的解决方案,必须存在更好的解决方案。
I've tried using the this
keyword but it does not refer to the Reversi class in this context.我曾尝试使用this
关键字,但在此上下文中它没有指代黑白棋类。
class Reversi {
constructor(dims) {
this.board = new Board(dims)
this.display = new Display(dims)
this.gameRunning = true
this.blackTurn = true
this.missedTurns = 0
this.humanPlayers = []
// this.blackPlayer = document.getElementById("engineSelect").value
this.blackPlayer = "human"
this.redPlayer = "human"
this.aiDelay = 200 //miliseconds
this.freeTiles = dims**2 - 4
this.gameHistory = ""
Object.defineProperty(this, 'openings', {
configurable: true,
writable: true,
value: []
})
}
loadOpenings(callback) {
let xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
callback(this)
}
}
xhttp.open("GET", "books/openings.txt", true)
xhttp.send()
}
callback(xhttp) {
let openings = xhttp.responseText.split("\n")
for (let i = 0; i < openings.length; i++) {
console.log(openings[i])
openings[i] = openings[i].split(", ")
}
reversi.openings = openings
}
this
won't work inside callback functions , one idea is to create a setter method that binds to the class, and then call it inside the callback. this
在回调函数中不起作用,一个想法是创建一个绑定到类的 setter 方法,然后在回调中调用它。 This would be the final code :这将是最终的代码:
class Reversi {
constructor(dims) {
this.board = new Board(dims)
this.display = new Display(dims)
this.gameRunning = true
this.blackTurn = true
this.missedTurns = 0
this.humanPlayers = []
// this.blackPlayer = document.getElementById("engineSelect").value
this.blackPlayer = "human"
this.redPlayer = "human"
this.aiDelay = 200 //miliseconds
this.freeTiles = dims**2 - 4
this.gameHistory = ""
Object.defineProperty(this, 'openings', {
configurable: true,
writable: true,
value: []
})
this.openings = []
}
loadOpenings(callback) {
//this is very important
var that = this
let xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
callback(this, that)
}
}
xhttp.open("GET", "books/openings.txt", true)
xhttp.send()
}
setOpenings(openings) {
this.openings = openings;
}
callback(xhttp, that) {
let openings = xhttp.responseText.split("\n")
for (let i = 0; i < openings.length; i++) {
console.log(openings[i])
openings[i] = openings[i].split(", ")
}
//reversi.openings = openings
that.setOpenings(openings)
}
This may sound crazy, but might work!这可能听起来很疯狂,但可能会奏效! :) Here is what I did : When you refere this
inside a callback, it refers to the context of callback function, not the parent class itself. :) 这就是我所做的:当您在回调中引用this
,它指的是回调函数的上下文,而不是父类本身。 In your code, it does not refer to Reversi, but outside the callback, this
refers to the Reversi class, so I copied the reference of this
to a variable that
, so now that
permanently has the reference of the class, now I defined a method called setOpenings()
and I am binding it to Reversi class.在你的代码,它并不是指黑白棋,但回调外, this
指的是黑白棋类,所以我复制的参考this
一个变量that
,现在that
永久拥有一流的参考,现在我定义了一个称为setOpenings()
方法,我将它绑定到黑白棋类。 So , inside callback using that
variable we can access members of Reversi
class, Hope you got it!因此,在使用that
变量的回调中that
我们可以访问Reversi
类的成员,希望你明白!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.