Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Local Storage Project

yoav green
yoav green
8,611 Points

getting the "recentSearches.forEach is not a function" error

https://w.trhou.se/82ae2gczu3

here's my snapshot.

thanks!

(i saw the earlier discussion here, but didn't manage to solve the problem, yet.

Hey there!

So it seems the issue lies within this code block in particular:

        var recentSearches = getRecentSearches();
        recentSearches.forEach(function(searchString) {
          appendListItem(recentSearchList,searchString);
        });

When I try entering a word into the search bar and clicking search, it seems as though the recentSearches variable comes out equivalent to a string of that word. For example, I enter foobar into the search bar, hit submit, and the recentSearches variable would output a string "foobar". JavaScript's .forEach() method requires you to call it on an array, as I don't think the method is capable of iterating through a string. I feel as though that might be the issue you are currently running into, with the recentSearches.forEach() coming out to not be a function. Try changing your code so that you run the .forEach() on an array that you put into recentSearches. Let me know if that helps!

2 Answers

I just hit this same issue and I think it's a result of bad data in your localStorage when using the Treehouse workspace. I'm pretty sure this is a result of the bug shown in the video of passing the incorrect data to JSON.stringify at the 10:17 mark. If manually clear localStorage in the dev tools it immediately fixed this error. Posted By: Victor Learned on Oct 4, 2016

@yoav green here is how I fixed it. Open dev tools (window Ctrl + Shift + J) this will open console. From there in the tab that has Console highlighted. Click on Application tab. Now on the left-hand side will be different tabs. Click on Local Storage tab. This will drop down another tab. Click on the tab that dropped down. The value in that tab will now be displayed in the window to the right && center. You may have to drag down the window under the Key | Value tabs to see details. See if the Key 'recentSearches' with the Value (whatever you put into the searchBar) is listed. If it is listed, click on it to highlight it. Now above the Key | Value references to the left (above Key) will be 3 tabs with a Filter Input box. The first tab is a Refresh tab, the middle is a Clear All tab, and the last is a Delete Selected tab. Click on the middle Clear All tab. This should make the Key 'recentSearches' with the Value (whatever) disappear. Meaning it is Deleted from Local Storage.

Now, refresh your browser (window Ctrl + R) and type in something into the searchBar. It should be saved and displayed under the Clear Storage button under the border solid line. And you should also see it in the Application Key | Value window.

Hope this helps fix your problem.

Hi @yoav green , It is an issue to do with passing incorrect data to JSON.stringfy(). To resolve this, just clear the localStorage manually, by running the command: localStorage.clear() in the browser console. You can then refresh the page and it should be resolved.