I have small project with cocktails, I want to use forEach function to separate object and it show me error , can you tell me what I am doing wrong ? Thanks
const url = 'https://thecocktaildb.com/api/json/v1/1/search.php?s=d'
const output = document.querySelector('.cocktailbody')
const drinks = fetch(url)
.then(res => res.json())
.then(data => {
console.log(data)
data.forEach(function(item) {
console.log(item)
})
})
CONSOLE MESSAGE: web.js:11 Uncaught (in promise) TypeError: data.forEach is not a function
at web.js:11
You are trying to access object with the forEach() method which is used for Array.
Use data.drinks.forEach(function(item){}) instead of data.forEach(function(item){}).
Here is the code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
const url = 'https://thecocktaildb.com/api/json/v1/1/search.php?s=d'
const output = document.querySelector('.cocktailbody')
const drinks = fetch(url)
.then(res => res.json())
.then(data => {
console.log(data)
data.drinks.forEach(function(item) {
console.log(item)
})
})
</script>
</head>
<body>
Hi There
</body>
</html>