在 javascript 中学习 OO：错误 - 无法读取未定义的属性

Question

I believe I've overlooked something I'm doing. I'm attempting to play around with objects and have some fun but I'm getting into this strange bug. I've used OO in C++/C#.

I create a game environment object that will contain all the information about this game.

I then created a validation tool (object) that houses regex tests for valid input, in which I call and pass into then return the test result.

With those objects, I then created a launch(); function that prompts the user for a user name and validates with the tool. It's in this call that I run into this bug.

I'm not sure if what I'm doing is legal in JS considering this bug.

 launch(); function launch() { var userNameInput = prompt("Please enter your name:", "User Name"); if (gameEnv.player(userNameInput)) { alert("Please enter only letters for a username."); location.reload(true); } } var gameEnv = { playerName: "", set player(input) { if (validationTool.LetterValidator(input)) { this.playerName = input; return 1; } else { return 0; } }, } var validationTool = { letterOnlyValidation: /^[a-zA-Z^\s]+$/, LetterValidator: function(input) { return letterOnlyValidation.test(input); }, }

Answer 1

First of all, unless you need to be compatible with older versions of JavaScript, ES6 JavaScript has actual class declarations you can use for OO.

Even with older JS the way to create an instance of a class is to define it using a function , and create new instance using new .

The problem with the particular code here:

var gameEnv = {
  playerName: "",
  set player(input) {
    if (validationTool.LetterValidator(input)) {
      this.playerName = input;
      return 1;
    } else {
      return 0;
    }
  },

}

...is that you've defined a setter for player with set , but there is no getter, so player can be set, but it can't be read back.

Also, since this object hasn't been created properly as a class instance using new , the this here refers to the global this , not to object itself.

Answer 2

few issues here:

• The set syntax binds an object property, should use = to assign value.
• order matters

 var gameEnv = { playerName: "", set player(input) { if (validationTool.LetterValidator(input)) { this.playerName = input; alert("player name set"); } else { alert("Please enter only letters for a username."); } }, } var validationTool = { letterOnlyValidation: /^[a-zA-Z^\s]+$/, LetterValidator: function(input) { return this.letterOnlyValidation.test(input); }, } launch(); function launch() { var userNameInput = prompt("Please enter your name:", "User Name"); gameEnv.player = userNameInput; }