💡 An editor is ready below the article—experiment freely!
Updated: 2026年5月31日
Array Map
Original task (JA): 配列のmap
📌
Conclusion
Array Map — free browser-based JavaScript practice
Why it matters in real projects
mapで配列の各要素を変換した新しい配列を作れます。 Similar patterns appear daily in code review and production UI work.Step-by-step workflow
1. Read the guide and understand the goal of "Array Map" 2. Review the JavaScript editor pane and start from the starter code 3. Open hints if stuck; compare your diff with the sample solution 4. Click Run and inspect preview/console output 5. Auto-check looks for output containing: 2, 4, 6. 6. After success, continue with adjacent exercises in the same categoryCore concept explained
mapで配列の各要素を変換した新しい配列を作れます。Technical focus
Key JavaScript APIs: console.log, .map(.Hint before you peek at the solution
numbers.map(n => n * 2)Sample solution walkthrough
JavaScript APIs used: console.log, .map(. Verify spelling and async/await usage. Explanation: mapで配列の各要素を変換した新しい配列を作れます。 Hint recap: numbers.map(n => n * 2)Solution code
📝 Sample code
const numbers = [1, 2, 3];
const doubled = numbers.map(n => n * 2);
console.log(doubled);Common mistakes for this exact task
・Skipping the hint: numbers.map(n => n * 2)Troubleshooting
Q: Preview does not change after Run A: Ensure you edited the JavaScript pane and clicked Run. Q: Looks correct but check fails A: Auto-check looks for output containing: 2, 4, 6. Look for typos, full-width spaces, or unclosed tags. Q: Console shows errors A: Open DevTools Console and fix bracket/quote mismatches at the reported line. Q: Hard to type on mobile A: Use landscape mode or continue on desktop—the same URL keeps progress in localStorage.Interview / portfolio tips
・Explain the techniques in "Array Map" in your own words within 30 seconds ・Practice walking through each line of the sample solution on a whiteboard ・Connect this task to a real component you would ship ・Mention responsive or accessibility trade-offs ・Describe when you use: console.log, .map(What to do after you pass
Move to the next exercise in the js-basic track, then continue the learning roadmap at /en/learning/js-basic/.Keywords
Free hands-on exercise covering 配列のmap, js-basic, 初級, console.log, .map(, array map—search-friendly guide for Array Map.🧪 Try it here — safe to break things
Use the editor below to write code and preview instantly.
Jump to editor■ Exercise task
numbersの各要素を2倍した新しい配列を作り、console.logで出力してください。numbersは[1,2,3]。
Hint if stuck
numbers.map(n => n * 2)