JS encapsulation recap

Here are some examples of parts of a program that are in the global scope. You could think of them as being in the root (if that is helpful?). However, it works for you – make sure you are 100% comfortable with what that means. There is no encapsulation (except for the fact that the program itself is encapsulated).

“Scope” is …

(introduced in es2015)

A function is its own mini-program. So, it makes sense that it would have scope just like the global program does.

If they didn’t, then you could never use the same variable name twice, and well, – everyone would give up programming.

It is not as cut and dry as you might think.

There are tons of areas with scope that we don’t think about that often.

Here’s a way to scope a block of code – and immediately run it when the page is ready.

…

The Difference Between Values and References in JavaScript – Dmitri Pavlutin

This works.

It’s hard to find a meaningful example – but stick with us. These objects are not connected to any master blueprint. They are just one-off copies that aren’t aware of each other or any backstory.

“Why does it work that way?”

Because they made it work that way. Someone designed it that way.

It might seem unnecessary to plan ahead for this – when you only have two simple objects with a few properties each. But consider a 3D model. It’s made up of hundreds of thousands of tiny little triangles. Each triangle has 3 points that are somewhere in the x/y/z axis of 3D space. What if you needed to generate a complex 3D model from a huge set of JSON data? This type of thing might come in handy.

You don’t need to memorize all this stuff. Just be sure you get the concepts and that you know their names of them. That way – if you’re doing something and you think something like this could help you, you can look them up as needed.

There aren’t really any classes in JavaScript (in the traditional sense) – but we have these things that look like them now!

They are “syntactic sugar,” / meaning they do the same thing as constructor functions, but they’ve made it so you can write it like this to align to other languages.

You’ll be encountering and using both of these. So spend some time using both of them.

It is nice and tidy. This syntax offers you a slightly more formal framework to organize your code.

domain > kingdom > phylum > class > order > family > genus > species

Long before there was HTML, language designers had adopted the word “Class” to define the methods and variables of a particular kind of object.

HTMLElement > div > div.light > div.light.small

HTML and CSS have also borrowed the naming convention to further define elements.

we should make one more with a class being extended and show how an HTML element works or something…