Hi, good questions!
First, yes, there’s an important difference. Think of it as being categories of data. When you type, 11, into JavaScript, JavaScript reads it and says, “11. Two digits. And a number.” And it’ll run functions, methods, etc on 11, acting on the data category that it is, indeed, a number.
But, what if someone’s name was ‘Eleven’? Better yet, what if we wanted to categorize that in our data structure as being spelled, 11?
Name: “11”
Now, JavaScript codes 11 not as a clump of numbers to perform operations on, but as a name, a string “”.
To answer the question about dots and brackets, let’s look at some code!
const dogs = {
Fido: "Mutt",
Hunter: "Doberman",
Snoopie: "Beagle"
};
const myDog = "Hunter";
const myBreed = dogs[myDog];
console.log(myBreed);
Okay, so we have a constant, an object, that we’re looking at. In this big category/constant of ‘dogs’, we have a big list of dogs - and that dog list is all one big object.
Then, when we go on to wanting to discuss or use other variables, we define them by referencing/referring back to the object we first defined.
We defined myDog as another constant we want to use. Specifically, that constant is worth the string “Hunter”. Cool. If we look up above, we see that in our list of dogs, the word ‘Hunter’ is there with a colon. So in that list, when we narrow it down to each property (as is denoted by that colon and then something following it) , we identify it by listing the exact string/number/etc.
Let’s keep that in mind and we’ll get to those brackets in a second.
We’ll make a new constant. Today, we just want to get a lot of information about our dog. Const myBreed will be defined as -
const myBreed = dogs[myDog];
This tells JavaScript, because of that bracket notation, to go and locate that object of dogs we made… we made that as a constant… and because we used box brackets, we told JavaScript, “Hey, that’s a property we’re looking for/passing through here.”
Now, onto the last part, the part we see this all come together.
Console.log is a method. It’s awesome. You can ask the console to report back to you the math, calculations, rewrites, functions, anything it’s done for an object or a variable and it will literally write back to you what it has stored in its system.
In this case, let’s ‘console.log(myBreed).’
This means that JavaScript will look back above and locate the constant, myBreed. It does, and it ‘reads’ that myBreed is like a little function on its own. It’s the dogs object with the myDog property run through it… Wait a second…
myDog was an object on its own, it was a constant variable. And that constant variable was worth the string, “Hunter”. So that means that JavaScript will run through the object dogs, find the match we ran through as a stand in property for [myDog] - which was the string “Hunter” - and it’ll report back what it finds there…
And what does it find there?
It finds the string, “Doberman.”
It took me a long time (and I’m sure I’ve got a couple of my terms turned a little around! I’m still learning as well!), but that’s how I’ve come to understand this. I hope this helps you and others who might be stuck!!