تگ های موضوع سنگ کاغذ و قیچی با جاوا اسکریپت

معرفی بازی سنگ، کاغذ و قیچی

بازی سنگ، کاغذ و قیچی یکی از بازی‌های کلاسیک و پرطرفدار است که معمولاً بین دو نفر انجام می‌شود. هدف این بازی بسیار ساده است: هر بازیکن یکی از سه گزینه را انتخاب می‌کند و در نهایت برنده بر اساس قواعد مشخص تعیین می‌شود.

قواعد بازی

- سنگ (خود به عنوان یک مشت بسته): سنگ کاغذ را می‌پوشاند و برنده می‌شود.
- کاغذ (خود به عنوان یک ورق): کاغذ قیچی را می‌پوشاند و برنده می‌شود.
- قیچی (خود به عنوان یک قیچی): قیچی سنگ را می‌شکند و برنده می‌شود.
بنابراین، اگر هر دو بازیکن یک انتخاب مشابه داشته باشند، بازی مساوی می‌شود.

پیاده‌سازی بازی با جاوا اسکریپت

برای شروع، می‌توانیم از جاوا اسکریپت استفاده کنیم تا این بازی را پیاده‌سازی کنیم. در اینجا یک مثال ساده از پیاده‌سازی این بازی به صورت کد آورده شده است:
```javascript
function playGame(playerChoice) {
const choices = ["سنگ", "کاغذ", "قیچی"];
const computerChoice = choices[Math.floor(Math.random() * choices.length)];
if (playerChoice === computerChoice) {
return "مساوی!";
} else if (
(playerChoice === "سنگ" && computerChoice === "قیچی") ||
(playerChoice === "کاغذ" && computerChoice === "سنگ") ||
(playerChoice === "قیچی" && computerChoice === "کاغذ")
) {
return "شما برنده شدید!";
} else {
return "کامپیوتر برنده شد!";
}
}
// مثال استفاده
console.log(playGame("سنگ")); // می‌تواند خروجی مختلفی داشته باشد
```

توضیحات کد

در این کد:

1. تنظیم انتخاب‌ها: ما یک آرایه به نام `choices` داریم که شامل گزینه‌های سنگ، کاغذ و قیچی است.
   

1. انتخاب کامپیوتر: با استفاده از `Math.random()` یک انتخاب تصادفی برای کامپیوتر صورت می‌گیرد.
   

1. مقایسه انتخاب‌ها: با استفاده از یک سری شرط‌ها، نتیجه بازی مشخص می‌شود. آیا بازیکن برنده شده، یا کامپیوتر، یا بازی مساوی شده است.
   

نتیجه‌گیری

بازی سنگ، کاغذ و قیچی نه تنها سرگرم‌کننده است، بلکه می‌تواند به عنوان یک پروژه کوچک و یادگیری مفاهیم ابتدایی برنامه‌نویسی جاوا اسکریپت مورد استفاده قرار گیرد. با اضافه کردن ویژگی‌های بیشتر، می‌توان این بازی را جذاب‌تر کرد.

سنگ، کاغذ، و قیچی در جاوااسکریپت: راهنمای کامل و جامع

در این مقاله، قصد دارم به طور کامل و جامع درباره پیاده‌سازی بازی “سنگ، کاغذ، و قیچی” در جاوااسکریپت صحبت کنم. این بازی، یکی از بازی‌های ساده اما جذاب است که می‌تواند به عنوان تمرینی عالی برای یادگیری مفاهیم برنامه‌نویسی و تعامل کاربر در وب باشد. پس، بیایید شروع کنیم و قدم به قدم این پروژه را بررسی کنیم.
مبانی بازی و منطق آن
در بازی سنگ، کاغذ، و قیچی، سه گزینه وجود دارد: سنگ، کاغذ، و قیچی. هر کدام از این گزینه‌ها نسبت به دیگری برتری دارند، و بر اساس قوانین زیر بازی تصمیم‌گیری می‌شود:
- سنگ برنده است در مقابل قیچی (سنگ می‌کوبد قیچی)
- قیچی برنده است در مقابل کاغذ (قیچی برش می‌دهد کاغذ)
- کاغذ برنده است در مقابل سنگ (کاغذ پوشانده سنگ)
اگر هر دو بازیکن، گزینه یکسان انتخاب کنند، نتیجه مساوی است. در بازی رایج، معمولا کاربر با کامپیوتر بازی می‌کند و باید گزینه خود را انتخاب کند، سپس کامپیوتر به صورت تصادفی یک گزینه را انتخاب می‌کند و نتیجه مشخص می‌شود.
پیاده‌سازی پایه در جاوااسکریپت
حالا بیایید یک نمونه کد پایه بنویسیم تا مفهوم بازی را نشان دهیم. در این مثال، از رویکرد ساده و بدون نیاز به رابط کاربری پیچیده استفاده می‌کنیم.
```javascript
// تابع برای تولید گزینه تصادفی برای کامپیوتر
function getComputerChoice() {
const choices = ['سنگ', 'کاغذ', 'قیچی'];
const randomIndex = Math.floor(Math.random() * choices.length);
return choices[randomIndex];
}
// تابع برای مشخص کردن برنده
function determineWinner(userChoice, computerChoice) {
if (userChoice === computerChoice) {
return 'مساوی!';
}
if (
(userChoice === 'سنگ' && computerChoice === 'قیچی') ||
(userChoice === 'قیچی' && computerChoice === 'کاغذ') ||
(userChoice === 'کاغذ' && computerChoice === 'سنگ')
) {
return 'شما برنده شدید!';
} else {
return 'کامپیوتر برنده شد!';
}
}
// فرض بر این است که کاربر گزینه‌ای را وارد می‌کند
const userChoice = prompt('انتخاب کن: سنگ، کاغذ، یا قیچی؟');
const computerChoice = getComputerChoice();
console.log(`انتخاب شما: ${userChoice}`);
console.log(`انتخاب کامپیوتر: ${computerChoice}`);
console.log(determineWinner(userChoice, computerChoice));
```
در این کد، تابع `getComputerChoice` یک گزینه تصادفی تولید می‌کند، و تابع `determineWinner` بر اساس انتخاب‌های کاربر و کامپیوتر، نتیجه را اعلام می‌کند. این نمونه، پایه‌ای است که می‌توانید آن را توسعه دهید.
اضافه کردن رابط کاربری HTML و CSS
برای جذاب‌تر کردن بازی، بهتر است از رابط کاربری در صفحات وب استفاده کنیم. مثلا، می‌توانید دکمه‌های انتخاب را قرار دهید و نتیجه را در صفحه نمایش دهید.
```html
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8" />
<title>سنگ، کاغذ، و قیچی</title>
</head>
<body>
<h1>بازی سنگ، کاغذ، و قیچی</h1>
<button id="rock">سنگ</button>
<button id="paper">کاغذ</button>
<button id="scissors">قیچی</button>
<p id="result"></p>
<script>
const choices = ['سنگ', 'کاغذ', 'قیچی'];
function getComputerChoice() {
const randomIndex = Math.floor(Math.random() * choices.length);
return choices[randomIndex];
}
function determineWinner(userChoice, computerChoice) {
if (userChoice === computerChoice) {
return 'مساوی!';
}
if (
(userChoice === 'سنگ' && computerChoice === 'قیچی') ||
(userChoice === 'قیچی' && computerChoice === 'کاغذ') ||
(userChoice === 'کاغذ' && computerChoice === 'سنگ')
) {
return 'شما برنده شدید!';
} else {
return 'کامپیوتر برنده شد!';
}
}
document.getElementById('rock').addEventListener('click', () => play('سنگ'));
document.getElementById('paper').addEventListener('click', () => play('کاغذ'));
document.getElementById('scissors').addEventListener('click', () => play('قیچی'));
function play(userChoice) {
const computerChoice = getComputerChoice();
const resultText = determineWinner(userChoice, computerChoice);
document.getElementById('result').innerText = `
انتخاب شما: ${userChoice}
\nانتخاب کامپیوتر: ${computerChoice}
\nنتیجه: ${resultText}
`;
}
</script>
</body>
</html>
```
در این نمونه، دکمه‌هایی برای انتخاب کاربر قرار داده شده است و نتیجه در صفحه نمایش داده می‌شود. این رویکرد، تجربه کاربری بهتری فراهم می‌کند و بازی را جذاب‌تر می‌سازد.
جمع‌بندی و نکات مهم
در نهایت، پیاده‌سازی بازی سنگ، کاغذ، و قیچی در جاوااسکریپت، نه تنها به شما کمک می‌کند مفاهیم پایه‌ای مانند رویدادها، تصادفی‌سازی، و منطق شرطی را یاد بگیرید، بلکه امکان افزودن ویژگی‌های پیشرفته مانند امتیازدهی، بازی چندنفره، یا حتی گرافیک‌های جذاب را فراهم می‌آورد. نکته مهم، تمرین مداوم و خلاقیت است؛ پس، حتما سعی کنید این نمونه را توسعه دهید و ویژگی‌های جدید اضافه کنید.
امیدوارم این راهنمای جامع، برایتان مفید بوده باشد و بتوانید پروژه‌های جذابی در آینده بسازید!