Я пытаюсь создать для себя задачу по кодированию в игре «Камень, ножницы, бумага», и у меня есть простая версия с текстовым полем, так что нет, я пытаюсь сделать это с помощью кнопок, я проделал это очень далеко, я просто на последнем шаге.
Итак, что я хочу сделать, так это взять информацию из функций rock(), paper() и scissors() и пойти дальше.
Это то, что у меня есть до сих пор
var playerInput = "blank"
function rock(playerInput) {
this.playerInput = playerInput;
playerInput = "rock";
}
function paper(playerInput) {
this.playerInput = playerInput;
playerInput = "paper";
}
function scissors() {
this.playerInput = playerInput;
playerInput = "scissors";
}
и что я хочу сделать оттуда, так это перенести его в другую функцию, где я уже создал саму игру.
я пробовал
var rock = rock();
console.info(rock.playerInput);
и это не сработало, пожалуйста, помогите.
Мне нравится помогать студентам. Если хочешь, мы можем провести видеозвонок через Google Meet. Пожалуйста, дайте мне знать, если вам нужно.
Я просто хочу добавить, это дало мне ошибку, не уверен, что это связано. Ошибка: ``` <a class='gotoLine' href='#81:13'>81:13</a> Uncaught TypeError: rock is not a function"```
Супер полезно: stackoverflow.com/a/53983473/383904
Я посмотрел на это, и я не знаю, что это значит, в нем есть много вещей, которые я действительно не понимаю.
function rock(playerInput) {
this.playerInput = playerInput;
}
var playerInput = 'blank'
var myRock = new rock(playerInput);
console.info(myRock.playerInput) // Should output "Blank"
Если вы хотите создать объект с обозначением функций, вам нужно использовать ключевое слово new
:
var myRock = new rock();
И вы должны передавать информацию объекту при его создании, а не раньше. Попробуйте что-нибудь вроде этого.
function rock(playerInput) {
this.playerInput = playerInput;
}
var myRock = new rock("Blank");
console.info(myRock.playerInput) // Should output "Blank"
Ошибка, которую я получил, была TypeError: камень не является конструктором"
Убедитесь, что вы не используете rock
как объект, так и функцию. Это должны быть разные имена. Сделайте функцию rock(), а затем создайте новую переменную с именем myRock или что-то еще.
Теперь я получил неопределенность
А вы использовали ключевое слово new
?
У меня есть ответ на этот вопрос, это определенно облегчило задачу, но спасибо за помощь.
[Вот очень полезный пример][1] о том, как решить логику игры «Камень, ножницы, бумага» с помощью кнопок.
Кроме того, вам не нужны несколько функций, программирование заключается не в копировании/вставке кода в файл, а в определении характеристик, которые мы можем использовать повторно.
Используйте атрибуты data-*
для хранения индекса фигуры:
function play() {
const player = Number(this.dataset.player); // Get 0, 1, 2 from button data-player
const computer = Math.floor(Math.random() * 3); // Generate random 0, 1, 2 integer
console.info(`PLAYER: ${player} COMPUTER:${computer}`);
// Game logic goes here
}
const buttons = document.querySelectorAll("[data-player]");
buttons.forEach(function(el) {
el.addEventListener("click", play);
});
<button data-player = "0" type = "button">ROCK</button>
<button data-player = "1" type = "button">PAPER</button>
<button data-player = "2" type = "button">SCISSORS</button>
Учитывая вышеизложенное, вы получили почти все необходимые данные.
0
(камень), 1
(бумага), 2
(ножницы).const fig = ["Rock", "Paper", "Scissors"];
const msg = ["You won!", "You lost :(", "It's a draw"];
function play() {
const player = Number(this.dataset.player); // Get 0, 1, 2 from button data-player
const computer = Math.floor(Math.random() * 3); // Generate random 0, 1, 2 integer
// Game logic goes here
// See: https://stackoverflow.com/a/53983473/383904
let result;
if (player === computer) {
result = 2; // Draw
} else if ((computer + 1) % 3 === player) {
result = 0; // Player wins
} else {
result = 1; // Computer wins
}
console.info(`PLAYER:${fig[player]} COMPUTER:${fig[computer]} ${msg[result]}`);
}
const buttons = document.querySelectorAll("[data-player]");
buttons.forEach(function(el) {
el.addEventListener("click", play);
});
<button data-player = "0" type = "button">ROCK</button>
<button data-player = "1" type = "button">PAPER</button>
<button data-player = "2" type = "button">SCISSORS</button>
Еще один ресурс, объясняющий логику, здесь [1]: https://stackoverflow.com/a/53983473/383904
что делает Number(this.dataset.player);
, а также что означают знаки $
Я думаю, что на самом деле понимаю, This.dataset означает, что вы можете использовать data-player = в HTML, но я не знаю, что означают знаки $
Это сработало очень хорошо, и я знаю, как это сделать дальше, я просто хочу знать, что все это делает.
@ZainWilson-WCHStudent developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… Я использовал литералы шаблонов вместо +
для объединения строк с переменными.
this
— нажатая кнопка, this.dataset
— способ чтения атрибута data-* кнопки, this.dataset.player
— значение атрибута data-player = "XY"
. Number
это... developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… используется для преобразования строки в число. Обратитесь к документам за тем, что вы не понимаете, или спросите
Еще один вопрос, что делает эль в forEach (el => { el.addEventListener("click", play);});
@ ZainWilson-WCHStudent Я отредактировал ответ ... изменил функцию Arrow на обычную функцию. Надеюсь, вам будет легче понять. Пожалуйста, прочтите: developer.mozilla.org/en-US/docs/Web/API/NodeList/forEachel
— это итерирующая кнопка (поскольку у нас их три!) — внутри цикла forEach вы назначаете щелчок эта конкретная кнопка.
поэтому я проверил ваше переполнение стека именно для этого, и мне было интересно, как его сбросить. Я попытался изменить все константы на переменные, а затем установить их на ноль с помощью функции сброса, и это не сработало. Я использовал document.querySelectorAll("[reset]") .forEach(el => el.addEventListener("click", reset));
, чтобы попытаться найти его, и это не сработало, что я могу сделать, чтобы исправить это?
@ ZainWilson-WCHStudent нет необходимости ничего сбрасывать из приведенных выше примеров. Хотя - если у вас есть внешние переменные, считающие количество сыгранных игр и количество побед - по клику сбрасываются только эти две. Я не могу знать, что не сработало из одной строки кода. Опубликуйте пример нового вопроса, если у вас есть несвязанная проблема. - Также "[reset]"
не является допустимым селектором. Вы имеете в виду скорее: ".reset"
лайк за то есть: <button class = "reset" type = "button">RESET</button>
?
this
работает только с объектами, и функция должна возвращать значение, чтобы использовать его вне функции. Если запустить код в неаккуратном режиме, все ваши функции просто присваивают строкуplayerInput
, которая является глобальной переменной. Это означает, чтоthis.playerInput === playerInput
.