Learn localstorage by building a todo app - Step 55

JavaScript
1

Step 55

If you check the “Application” tab of your browser console, you’ll notice a series of [object Object]. This is because everything you save in localStorage needs to be in string format.

To resolve the issue, wrap the data you’re saving in the JSON.stringify() method. Then, check local storage again to observe the results.

I’ve tried this localStorage.setItem.JSON.stringify(("data", myTaskArr));
and this localStorage.setItem("data",JSON.stringify( myTaskArr));
and this localStorage.setItem("data", myTaskArr).JSON.stringify;
and many variations of these.

What’s the correct way to do it? I think this lesson should be redone with clear instructions. It’s ridiculous that it expects us to know how to do it when it’s the first time we’ve ever heard of JSON.stringify.

Thanks for your help!

2

please post a link to the challenge in your original post.

3

the “data you’re saving” that they are referring to is the myTaskArr variable.
So they want you to wrap that variable (in the original code of this step) in a JSON.stringify() method call so you can read it.
That means they want you to replace the myTaskArr variable with a call to JSON.stringify() and pass it the myTaskArr which is the JSON code we are ‘stringifying’.

4

Isn’t that what I did here: localStorage.setItem("data",JSON.stringify( myTaskArr));
What part is wrong?

5

yes this code should work (and does work for me)
Maybe you should click Reset in case you changed something else in your zeal to work this one out.

6

That code works for me as well.

I’m not sure explaining JSON.stringify() would change anything. As long as you understand the data must be saved in a string format and that the data is the second argument to localStorage.setItem() it should make enough sense.

7

Finally got it to work. Had to reset it.

Once I reset it, I wasn’t able to copy-paste the above code. That returned an error for some reason. And there were red squigly underlines (representing typos) before and after “data”. It threw the error :

Your localStorage.setItem() should have a key of “data”

Even though it did have the key of data. So I reset it again, and then this time only changed the part after the comma. Then it worked. I think there might be a bug in the checking software.

8

Thanks for your help, guys.

Yeah, now that I know it was a bug in the checking mechanism, it does make enough sense as it is (it was one of the methods I originally tried).

9

I wonder if you were using curly quotes instead o straight quotes? That would cause a problem.
The straight ones are these " and the curly ones are “

10

I see the difference in your post. But I don’t know what causes them to be straight or curly. It’s the same key press, right? The key to the right of colon/semi-colon.

Do the two look the same in the FCC editor?

11

The two quotes look different but you have to be aware of the difference to notice it. Are you still having a problem?

12

I believe the quotes should appear correctly when typed normally in the editor. They should appear straight in any cause, if they are curved you can see it.

When you copy/paste code into the forum without backticks or formatting as code, the forum will translate those into the wrong kind of quotes, which can cause confusion. If that code is then copied back into your editor, you now have the wrong quotes.

13

Well I was able to progress past this lesson eventually (I explained how earlier).

That’s good to know, and could explain some of the issues I was facing.

So for future reference I would love to know:

  • What is the correct type to use in my code, straight or curly? Is there some parts of code that require one type, and others that require the other?
  • How to produce straight or curly quotation marks. So I can apply the correct method when making my code.
14

Hi @totaleclipse

Here are the types of characters you can use:

  • ' single quote mark
  • " double quote mark
  • ` back tick

When code is not correctly formatted in a post, straight quote marks can change into curly ones.

Use the following method to post code to the forum:

  1. On a separate line type three back ticks.
  2. On a separate line paste your code.
  3. On the last line type three back ticks.

So avoid copying unformatted code in a markdown post.
You can use the quote marks on your keyboard.

If your code has strings containing quote marks, you’ll need to use a different type within the string, or escape them with \

Happy coding

15

Straight, always straight. Here’s info on how to type curved quotes which you should never do:

https://www.lifewire.com/typing-quotes-apostrophes-and-primes-1074104

16

Thank you, @Teller & @pkdvalis .

Thanks for answering my two questions! So I definitely didn’t type curly quotes into my code myself. Maybe it was from copying code on the forum (which I think I did after it not working a few times). But I also find that unlikely, because when typed in the FCC editor, they get underlined with a red squigly. But it’s good to know this stuff for the future, so thanks again.