Now to start, let me again clarify what exactly objects are.
Now of course we worked with objects a lot throughout this course but it's super important to make sure that
we all understand and are on the same page regarding the definition of objects.
Now objects are core data structures in Javascript, an object is a super important data structure because
it typically is used or helps us reflect real world entities.
Now this might sound strange,
what does this mean?
It means that with objects in Javascript, we have a way of working with things like buttons or movies
which are things to us, right?
A button, even if it's on a web page which is digital of course, even there it's a thing to us humans.
We all know what's meant
if I talk about a button on a web page, we have something in mind if I talk about a movie.
It's no coincidence that when we then create a movie here for example in code, it has things that would
make sense for a movie to have, a title, a preview image
basically, a rating. So we can think as we think in the real world
but now when we write our code and that's how we do want to write our code. We don't want to write some
abstract code which you don't really understand if you're not a programmer, you might not understand
the syntax but having a look at that, it's probably fairly easy to understand that we're describing a
movie, we might not know what we do with it but this describes a movie.
So that's the idea behind objects, we describe real world entities, we allow ourselves to write code that
makes sense to humans if you will,
so we can apply our real world logic to coding in the end.
Now technically, objects in Javascript are of course data structures that are made up of properties,
these are these key-value pairs and methods. Methods in the end are also key-value pairs but the value
is a function that's tied to that object.
So you could say properties are variables in an object,
methods are functions in an object.
So we use properties to store data, data that somehow is related in one and the same object and then
maybe some actions that makes sense for this object.
Now we haven't worked too much with methods throughout this course, that will change in this module and that
will actually be a very powerful feature when we work with objects in Javascript.
So in the end, objects allow us to group related data together and also they allow us to split our code
into logical pieces.
We don't have to manage everything in tons of variables which are thrown into our script file,
instead we have some objects that help us do different things,
now of course there's a broad variety of use cases for such objects. You might have simple objects like
just a movie which you use somewhere and more complex objects like such a DOM node which actually has
a lot of built-in methods that help you interact with it, query its children
and also a lot of built-in properties that help you style this node or change its value or whatever it
is,
so there are a lot of things you can do with it depending on which kind of object you're working with.
So objects are extremely versatile and in the end, power Javascript.
So what is an object in Javascript then or how do you see that something is an object
if you didn't create it yourself with the curly braces? Well in Javascript you must never forget that
you have two types of values - primitive values and reference values and in the end, reference values are
objects, so only objects are reference values to put it like that.
Now primitive values are these types of values - numbers, strings, booleans, null, undefined and symbol and
we haven't had a look at symbol yet,
it's an advanced niche type which I'll cover way later in the course
but the other types should be familiar to you, especially numbers, strings and booleans.
Now on the other hand, reference values
as I said, that are just objects. So everything else with which you work, for example DOM nodes and so
on,
well that's an object.
Objects are the things you create on your own with these curly braces,
this is called the object literal notation to create an object,
so you're creating an object by creating or by writing such an object literal but we also for example
have arrays and whilst arrays are of course specific types of objects with that length property which automatically
adjusts
and with that special functionality where we can use it in a for/of loop and we can't do that with any
object, only with these iterables as you learned. So arrays are special types of objects but they're also just
objects in the end. DOM nodes, these are also objects, the things which we select in our DOM,
these are objects and much much more. Anything which is not a number, a string, a boolean, null, undefined
or such a symbol and you don't have to worry about the symbol here,
that's not something you'll encounter in your normal Javascript code, so anything else is an object.
So now that we clarified what objects are,
let's dive into some code. Now for this module here,
I prepared a simple demo application for you again where we will actually do more than just log stuff
to the console.
Again, we're back to some movies, here we'll later be able to add our favorite movies, add some extra information
of our choice to them and then add them to a list which we then can even filter,
so where we can enter a search term and filter.
Now we start with absolutely nothing because we have all the tools we need but we also won't dive right
into this app because there are a couple of things I want to recap about objects and I want to introduce
about objects which we haven't learned yet.