Sunday, June 24, 2018

javascript - How do I iterate through an object using .map?

I have an app that plays a random sound from the selected array based on which button you push. I want to also give the option of listing all the sounds in an array on demand.




I've been going through all kinds of different suggestions using for loops and .map but I keep running into a wall with the fact being that I can't use .map on an object... I think.



class Randomizer extends React.Component {

constructor(props) {
super(props);
this.state = {
currentSound: {name: "laser", sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/Collision8-Bit.ogg"},
myArray: [

{
name: 'laser',
sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/Collision8-Bit.ogg"
},
{
name: 'laugh',
sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/Evillaugh.ogg"
},
{
name: 'jump',

sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/jump.ogg"
}
],
myArraySequel: [
{
name: 'laser2',
sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/Collision8-Bit.ogg"
},
{
name: 'laugh2',

sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/Evillaugh.ogg"
},
{
name: 'jump2',
sound: "http://commondatastorage.googleapis.com/codeskulptor-assets/jump.ogg"
}
]
}
}


newSound(arr){
this.setState((prevState)=>{
return {currentSound: prevState[arr][Math.floor(Math.random()*prevState[arr].length)]}
})
};



render() {
return (





Listen!
autoPlay
src={this.state.currentSound.sound}>

{this.state.currentSound.name}





sounds from myArray


{/* list of buttons with the name value as the the button name and it will play the sound associated when pressed */}


);
}
}


function App() {
return (

RandomSoundboard




);
}

export default App;



when I've used .map it's told me to use an array of course.

No comments:

Post a Comment

plot explanation - Why did Peaches' mom hang on the tree? - Movies & TV

In the middle of the movie Ice Age: Continental Drift Peaches' mom asked Peaches to go to sleep. Then, she hung on the tree. This parti...