Rock–Paper–Scissors in JavaScript using ternary operators I just built a simple Rock–Paper–Scissors game using JavaScript, a fun exercise in logic, randomness, and conditional statements! How it works: The program first defines the possible game choices: Rock, Paper, or Scissors. The player is prompted to enter their choice. The computer randomly picks one from the list. Using ternary operators inside an if statement, the code checks the winning conditions and prints out who won. Key Concepts Practiced: Array indexing Random number generation (Math.random() + Math.floor()) Conditional checks (if + ternary operators) Basic user interaction with prompt(); Example Output: Computer choice: Scissors. User choice: Rock Player wins! I really enjoyed blending logic with a little randomness here. Next, I might upgrade it to keep scores, add rounds, and even a UI version with buttons! What do you think — should I turn this into a full browser game? ⚡ #JavaScript #Coding #BeginnerProjects #WebDevelopment #LogicBuilding #GameDev
Building Rock–Paper–Scissors in JavaScript with Ternary Operators
More Relevant Posts
-
💡 Most devs think shallow copies always affect the original… but that’s not true! Let’s clear this common JavaScript misconception 👇 🧩 Example 1 — Primitives let obj = { a: 1, b: 2, c: 3 }; let obj2 = { ...obj }; obj2.b++; console.log(obj.b); // 2 ✅ unchanged ➡️ Here b is a primitive (number). Primitives are copied by value, so obj and obj2 have separate copies. Incrementing obj2.b doesn’t affect obj.b. ⚠️ Example 2 — Nested Objects let obj = { a: 1, b: { x: 10 } }; let obj2 = { ...obj }; obj2.b.x = 99; console.log(obj.b.x); // 99 ❗changed ➡️ Here b is an object, and a shallow copy only copies its reference. Both obj.b and obj2.b point to the same memory. So changing one affects the other. 💬 TL;DR Shallow copy doesn’t always affect the original — it depends on what’s inside the object. Primitives → safe Objects → shared #JavaScript #Frontend #WebDevelopment #ReactJS #CodingTips #Programming #JSFacts
To view or add a comment, sign in
-
💡 The Curious Case of NaN in JavaScript Ever tried this in JavaScript? 👇 console.log(typeof NaN); // 🤔 Surprise! The output is "number" 😄 That’s right — NaN (Not-a-Number) is ironically of type number! It represents an invalid numeric operation — like dividing 0 / 0 or parsing Number("abc"). Think of it like this: “NaN is JavaScript’s polite way of saying — I tried to do the math, but it doesn’t make sense!” 😅 #JavaScript #CodingTips #WebDevelopment #FrontEnd #LearnJavaScript #CodeNewbie #TechCommunity #DeveloperLife #ProgrammingHumor
To view or add a comment, sign in
-
💥 Bubble Pop Madness — My First JS Game! 🎮 I turned a simple idea into a fun little challenge — a Bubble Game made completely using HTML, CSS & JavaScript! 😍 Try it out here 👉 https://lnkd.in/gDZHWACR You get 20 seconds ⏱️ to hit the correct bubble (a random number challenging you each time), gain points for each correct click, and lose points for a wrong one. Each click updates your score instantly and reshuffles the bubbles — super addictive! This project helped me dive deep into how game logic, DOM manipulation, and event handling work together for real-time interactivity. It’s a small project but taught me that with just core web tech, you can build something dynamic and fun! 💡 💬 I’d love to hear your thoughts, ideas or suggestions to make it even better! #Coding #JavaScript #FrontendFun #GameDevelopment #WebDevJourney #LearnByBuilding #HTML #CSS #FrontendDeveloper #Programming
To view or add a comment, sign in
-
Recently I was preparing for JavaScript and I stumbled upon a simple concept — but most people don’t know the key differences between var and let. Here’s a quick example: ` for (var i = 0; i < 3; i++) { setTimeout(() => console.log(i), 1000); } // Output: 3 3 3 ` ` for (let i = 0; i < 3; i++) { setTimeout(() => console.log(i), 1000); } // Output: 0 1 2 ` Key differences: Scope: var is function-scoped, let is block-scoped. Hoisting & Temporal Dead Zone: var is hoisted and initialized with undefined, let is hoisted but not initialized — accessing it before declaration throws a ReferenceError. Understanding these small details can save you from tricky bugs, especially in loops and async code! #JavaScript #JS #WebDevelopment #FrontendDevelopment #Coding #LearnToCode #DeveloperTips #TechCommunity #CodeSnippet #Programming ## I’d appreciate it if you could share a few more examples to help me understand.
To view or add a comment, sign in
-
Just finished building a classic Guessing Game using HTML, CSS, and JavaScript! This project was a brilliant exercise in applying conditional logic and providing instant user feedback. The goal? Find the right number between 1 and 100 Key Technical Details: Generating the Secret Number: Used Math.random() and Math.ceil() in JavaScript to generate a new, random integer between 1 and 100 at the start of the game. JavaScript let randomNumber = Math.ceil(Math.random() * 100); DOM Manipulation: I grabbed elements for the user's input and the game result display using document.getElementById(). The checkGuess() Function (The Core Logic): It parses the user's input using parseInt(). Conditional Statements (if/else if/else): Checks if the guessed number is "Too High," "Too Low," or "Just Right." User Feedback: The game dynamically updates the result text (gameResult.textContent) and changes the background color of the result message to clearly indicate: "Too High/Low" (blue/default color) "Congratulations!" (Green success color) 🎉 This project reinforced the importance of input validation, clear logic flow, and immediate user experience. What small projects have helped you master JavaScript fundamentals? Let me know in the comments! 👇 #JavaScript #WebDevelopment #CodingProjects #HTML #CSS #Programming #GuessingGame #Frontend
To view or add a comment, sign in
-
💻 Exploring DOM in JavaScript! 🎯 Today, I continued my journey of learning and experimenting with the Document Object Model (DOM) — one of the most exciting parts of JavaScript that helps bring web pages to life! 🌐 Here are some of the amazing tasks I worked on today 👇 🔹 Simple Math Calculator ➕➖✖️➗ – created a basic calculator using DOM manipulation where I handled user input and displayed real-time results. 🔹 Show/Hide Password Feature 🔒👁️ – implemented a toggle feature to hide or reveal the password using simple JS logic. 🔹 Swapping Content Between Two Paragraphs 🔁 – learned how to dynamically exchange content between elements on a click event. 🔹 Generating Random Background Colors 🎨 – added functionality to change the background color randomly, giving a fun interactive touch to the webpage. Each of these tasks helped me understand DOM events, element selection, and manipulation more deeply and improved my problem-solving and logic-building skills in JavaScript. 🚀 You can check out all my DOM tasks here on my GitHub 👇 🔗https://lnkd.in/dAhB6gjM #JavaScript #DOM #WebDevelopment #LearningJourney #FrontendDevelopment #Coding #100DaysOfCode #DeveloperJourney
To view or add a comment, sign in
-
Hey, Mates. How are you doing? You know, Even experienced devs trip over JavaScript quirks sometimes — here are a few I’ve seen (and made myself 😅 as well): 1. Using var instead of let or const var is function-scoped and can cause weird bugs due to hoisting. ✅ Use let for variables that change and const for ones that don’t. 2. Forgetting to handle async properly Mixing promises, callbacks, and async/await can lead to race conditions or unhandled rejections. ✅ Always await async functions or chain with .then(), and wrap in try/catch. 3. Comparing values incorrectly == does type coercion (and sometimes weirdly!). ✅ Stick to === for strict comparison. 4. Misunderstanding this Arrow functions don’t have their own this — they inherit from the parent scope. ✅ Know when to use arrow functions vs regular ones. 5. Not handling floating-point math 0.1 + 0.2 !== 0.3 (yes, really). ✅ Use libraries like decimal.js or round your values when precision matters. ⸻ These are small details — but they separate good JavaScript from great JavaScript. 💬 What’s a JS mistake you’ve seen (or made) that taught you something valuable? #JavaScript #WebDevelopment #Programming #CodingTips #Frontend
To view or add a comment, sign in
-
💡 Exploring JavaScript Interactivity! 💻 This week, I had fun working on two small yet engaging front-end projects using HTML, CSS, and JavaScript 🎯 1️⃣ 🪙 Coin Toss Simulator: Simulates a real coin flip using JavaScript’s Math.random() Dynamically switches images between Heads and Tails Changes the background color for a lively effect live-link:https://lnkd.in/gupfGSwM 2️⃣ 💡 Bulb On/Off Project: Demonstrates DOM manipulation with simple querySelector() Toggles between two images to simulate bulb states These projects helped me strengthen my understanding of DOM manipulation, event handling, and conditional logic in JavaScript 🔁 Here’s a quick takeaway: even simple projects can make complex concepts click when you build them yourself! 🚀 ✨ Always learning, always building. live-link:https://lnkd.in/gmkVzxFG 10000 Coders sanjeev ch #HTML #CSS #JavaScript #WebDevelopment #LearningByDoing #FrontendDevelopment #CodingJourney
To view or add a comment, sign in
-
🎨 Built a Fun Color Changing Activity with JavaScript! 💻✨ Today, I worked on a small but really exciting activity — a Color Changing App that generates a random color every time you click! 🌈👆 It was super fun to see how just a few lines of code can create something so interactive and visually engaging. 🔥 🧠 Tech Stack Used: 💻 HTML – for structure 🎨 CSS – for styling ⚙️ JavaScript – played the major role in generating and applying random colors dynamically This activity helped me understand how JavaScript interacts with the DOM to create real-time effects, and it definitely made my learning session more enjoyable! 😄 💡 Small projects like these make learning more practical and exciting! 🚀 #JavaScript #Coding #WebDevelopment #FrontendDevelopment #LearningByDoing #MiniProject #Innovation #Consistency
To view or add a comment, sign in
-
💥 Why NaN !== NaN is TRUE (and Why That’s Actually Logical 🤯) Ever tried this in JavaScript? console.log(NaN === NaN); // false 😵 And thought — “Wait… what?! How can something not equal itself?” Here’s the logic 👇 NaN means “Not a Number”. So when JS checks NaN === NaN, it’s basically asking: “Is this invalid number the same as that invalid number?” The answer? ❌ Nope. Because both are different invalid results, and JS doesn’t assume that two unknowns are equal. It’s like comparing two “undefined answers” in math — 👉 “I don’t know” ≠ “I don’t know” If you ever need to check for NaN properly, use: Number.isNaN(value) Because JS comparisons can lie, but Number.isNaN() tells the truth 😎 Follow Prashansa Sinha for more fun & logical JavaScript breakdowns 💡 #JavaScript #NaN #JSLogic #WebDevelopment #Frontend #CodingFacts #LearnJS #TechExplained
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development
If this is meant as a demonstration or practice exercise, I would suggest the next steps might be: 1. Do rock-paper-scissors-lizard-spock. 2. See if you can do something to simplify all those cases...