Props witten as strings?

Tell us what’s happening:
Describe your issue in detail here.

Why are props written as string i.e. “hat” instead of hat? Looking on MDN props should be written without quotation marks.
Your code so far


// Setup
var testObj = {
"hat": "ballcap",
"shirt": "jersey",
"shoes": "cleats"
};

// Only change code below this line

var hatValue = testObj;      // Change this line
var shirtValue = testObj;    // Change this line
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:93.0) Gecko/20100101 Firefox/93.0

Challenge: Accessing Object Properties with Dot Notation

Link to the challenge:

Keys in objects are strings. As long as they are valid names (for example not numbers, no spaces), JS syntax allows you to write them without the quotation marks, because it would be annoying to have to use quotation marks all the time. But it makes no difference if you do use quotation marks explicitly.

(And if you do want to use, for example, a number as a key, or “words with spaces in-between”, then you have to use quotation marks)

2 Likes

Thank you for explaining that, makes more sense now. :slightly_smiling_face:

2 Likes

That makes it a JavaScript Object Notation or JSON

No, it doesn’t. JSON is just text, designed to be written a certain way so that it’s easy for both machines and humans to read and write. The way it looks is based on JS object notation, so it translates very easily to and from JS, but it’s not JS. It is just a text format for exchanging data, it doesn’t have anything to do with a specific programming language.

1 Like

So you are saying that’s not json?

This:

var testObj = {
  "hat": "ballcap",
  "shirt": "jersey",
  "shoes": "cleats"
};

is not JSON. It is a JS. It is JS that is written in a way that resembles JSON - the double quotes around all properties, for example. In JS you could write it that way, but this would be more common:

var testObj = {
  hat: "ballcap",
  shirt: "jersey",
  shoes: "cleats"
};

Not that in JSON, you must wrap the property names in double quotes. In JS it is usually optional, unless the property is not a valid JS identifier. In JSON, strings must be wrapped in double quotes - in JS it could also be single quotes or backticks.

You will here the first one called a “JSON” object, but that is not accurate - it is a JS object that someone wrote out in a JSON-ish format. (I really don’t know why people teach these this way - to me it just adds confusion.)

It is JSON if it is in a JSON file. It can also be JSON encode as a JS string (JSON.stringify changes a JS object into a JSON formatted string, and JSON.parse undoes it.) The main places I encounter JSON in the wild is either JSON files (text files with the data written in a JSON format) or in responses to http requests.

JSON data and JS objects are very compatible - the data represented in JSON is a subset of what you can show in a JS object/array/etc. In other words, JSON data can always be converted to some kind of JS object, array, or data. But not all JS data can be stored as JSON. For example, JS objects can have functions and circular references, but JSON cannot.

In JS, the only thing that is truly JSON is a JS string with JSON encoded data.

2 Likes

Just to stress, JSON in JavaScript is always a string.

A JSON file is text, written a certain way (eg { "key": "value" }) that makes it easy to pass data around between computers.

So, normal example, you want to get some data from a server. In your program, you make an HTTP request. What the server returns will be in a structured format that is easy for the program on the server to create, easy to send as binary data, and easy for your program to read at the other end.

The format can’t be something specific to one programming language, it has to be something independent of programming languages.

JSON is just text. You can’t really use it directly in JS. To JS it’s exactly the same as any other string, because it is just a string.

This is what JSON looks like in JS:

"{ \"greeting\": \"Hello\" }"

That string, that’s what I get if I have an object

{ greeting: "Hello" }

and I run

JSON.stringify({ greeting: "Hello" })

And then if I take that JSON string, and run

JSON.parse("{ \"greeting\": \"Hello\" }")

then I get a JS object

{ greeting: "Hello" }

Thank you for explaining that clearly :ok_hand:t5:

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.