Возможно ли перенести метод render() класса 'DreamField' в композицию?
Есть проблема в том что мне нужно перенести метод render класса 'DreamField' в объект класса 'Roulette' через композицию?
Вот Html код:
<div id="forGame"></div>
<input type="button" value="Start" onclick="start()" />
Вот JavaScript код:
class DreamField {
constructor(word, tip) {
Object.defineProperty(this, "Word", { value: word });
Object.defineProperty(this, "Tip", { value: tip });
this.forGuessLetterCount = word.length;
if (!DreamField.counter) DreamField.counter = 0;
}
onButtonClick(event) {
var letter = this.input.value;
if (this.Word.includes(letter)) {
let count = 0;
for (var i = 0; i < this.Word.length; i++) {
if (letter == this.Word[i]) {
this.tdArray[i].innerText = letter;
this.forGuessLetterCount--;
count++;
}
}
alert(`Вы угадали ${count} букв`);
if (this.forGuessLetterCount == 0) {
alert("Победа");
}
} else {
alert("Нет такой букви в этом слове");
}
this.input.value = "";
}
render() {
var container = document.getElementById("forGame");
var div = document.createElement("div");
div.innerText = `Подсказка: ${this.Tip}`;
container.appendChild(div);
this.tdArray = [];
var table = document.createElement("table");
table.id = DreamField.counter++;
table.border = "2px solid black";
container.appendChild(table);
var tr = document.createElement("tr");
table.appendChild(tr);
for (var i = 0; i < this.Word.length; i++) {
var td = document.createElement("td");
td.innerText = "*";
tr.appendChild(td);
this.tdArray.push(td);
}
this.input = document.createElement("input");
this.input.maxLength = "1";
this.input.type = "text";
container.appendChild(this.input);
var button = document.createElement("input");
button.type = "button";
button.value = "Проверить";
button.onclick = this.onButtonClick.bind(this);
container.appendChild(button);
}
}
class Roulette {
constructor(questWord1, questWord2) {
this.questWord1 = questWord1;
this.questWord2 = questWord2;
}
getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
getRandomBonus() {
this.bonus = ["300", "x3", "700", "0", "1000", "x2"];
this.nowString = this.bonus[this.getRandom(0, this.bonus.length - 1)];
return this.nowString;
}
}
function start() {
//(new DreamField("HELLO", "Common greating")).render("forGame");
// var game = new DreamField("HELLO", "Common greating");
// game.render("forGame");
// var game2 = new DreamField("HELLO", "Common greating");
// game2.render("forGame");
let m = [
new DreamField("hello", "common"),
new DreamField("Портрет", "Висит в школе"),
];
}
Код snippet:
class DreamField {
constructor(word, tip) {
Object.defineProperty(this, "Word", { value: word });
Object.defineProperty(this, "Tip", { value: tip });
this.forGuessLetterCount = word.length;
if (!DreamField.counter) DreamField.counter = 0;
}
onButtonClick(event) {
var letter = this.input.value;
if (this.Word.includes(letter)) {
let count = 0;
for (var i = 0; i < this.Word.length; i++) {
if (letter == this.Word[i]) {
this.tdArray[i].innerText = letter;
this.forGuessLetterCount--;
count++;
}
}
alert(`Вы угадали ${count} букв`);
if (this.forGuessLetterCount == 0) {
alert("Победа");
}
} else {
alert("Нет такой букви в этом слове");
}
this.input.value = "";
}
render() {
var container = document.getElementById("forGame");
var div = document.createElement("div");
div.innerText = `Подсказка: ${this.Tip}`;
container.appendChild(div);
this.tdArray = [];
var table = document.createElement("table");
table.id = DreamField.counter++;
table.border = "2px solid black";
container.appendChild(table);
var tr = document.createElement("tr");
table.appendChild(tr);
for (var i = 0; i < this.Word.length; i++) {
var td = document.createElement("td");
td.innerText = "*";
tr.appendChild(td);
this.tdArray.push(td);
}
this.input = document.createElement("input");
this.input.maxLength = "1";
this.input.type = "text";
container.appendChild(this.input);
var button = document.createElement("input");
button.type = "button";
button.value = "Проверить";
button.onclick = this.onButtonClick.bind(this);
container.appendChild(button);
}
}
class Roulette {
constructor(questWord1, questWord2) {
this.questWord1 = questWord1;
this.questWord2 = questWord2;
}
getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
getRandomBonus() {
this.bonus = ["300", "x3", "700", "0", "1000", "x2"];
this.nowString = this.bonus[this.getRandom(0, this.bonus.length - 1)];
return this.nowString;
}
}
function start() {
(new DreamField("HELLO", "Common greating")).render("forGame");
var game = new DreamField("HELLO", "Common greating");
game.render();
var game2 = new DreamField("HELLO", "Common greating");
game2.render();
let m = [
new DreamField("hello", "common"),
new DreamField("Портрет", "Висит в школе"),
];
}
<div id="forGame"></div>
<input type="button" value="Start" onclick="start()" />
У меня есть класс Roulette и мне нужно чтобы после каждой отгаданной буквы(у класса "DreamField") у меня выбирался случайный бонус и добавлял к количеству очков(дополняя метод render класса "DreamField").Как это реализовать и вообще возможно ли это?