Medium
How to Display Chat Messages Separately Using JavaScript Array Map Method
You’re implementing a simple chat application where users can send messages to each other. However, there's a problem with how messages are being displayed on the screen. The application shows all messages as one string instead of separate messages. Can you spot what's wrong with this code?
1const messages = [2 { sender: 'John', content: 'Hey there!' },3 { sender: 'Jane', content: 'Hi! How are you?' },4 { sender: 'John', content: 'I\'m good, thanks!' },5 { sender: 'Jane', content: 'Great to hear!' }6];78const displayMessages = (messages) => {9 return messages.map(message => `${message.sender}: ${message.content}`).join('');10};1112console.log(displayMessages(messages));