In this course, we'll look at the JavaScript language, and how it supports the Object-Oriented pattern, with a focus on the unique aspect of how JavaScript approaches OO. We'll explore a brief introduction to the jQuery library, which is widely used to do in-browser manipulation of the Document Object Model (DOM) and event handling. You'll also learn more about JavaScript Object Notation (JSON), which is commonly used as a syntax to exchange data between code running on the server (i.e. in PHP) and code running in the browser (JavaScript/jQuery). It is assumed that learners have already taken the Building Web Applications and Building Database Applications in PHP courses in this specialization.
JavaScript - Building Objects
Loading...
Do curso por University of Michigan
JavaScript, jQuery, and JSON
86 ratings
Na lição
JavaScript Objects
We do a quick look at how the JavaScript language supports the Object-Oriented pattern. This is the second time we look at the OO pattern so we focus on the unique aspect of how JavaScript approaches OO.
Conheça os instrutores
Charles SeveranceAssociate Professor
School of Information
So before we start going through JavaScript sample code for our objects,
I want to talk a little bit about this shirt.
This shirt, for those of you who don't know, is a Golpher shirt.
This shirt was made in 1992 and so it's a rare commodity.
So for those of you who don't know, we have this thing called the World Wide Web,
and it's HTTP, yadda yadda.
The World Wide Web was invented in 1980, and Gopher was invented in 1980.
And Gopher was invented by Mark McCahill at the University of Minnesota.
And Gopher was really popular until about 1993, 94, and
all of a sudden the web took off.
And so Gopher's like the forgotten web-like technology.
But the key thing about Gopher is that,
we might not have the Web if it weren't for Gopher.
And so for a while, the Web and Gopher competed, and Gopher was winning.
And then the Web had to get better and better and better, and
then at some point the Web became the thing.
So why do I tell you this?
Well, in this class, I teach you a lot of basic things.
I teach you basic JavaScript, I teach you basic PHP, I teach you basic SQL.
And you might be sitting there thinking, how come you're not teaching me something
fancy like Rubio Royal or Angular or something really cool?
And the answer is the basics are way, far more important, than the fancy stuff.
Because once you know the basics, the fancy stuff can happen.
And so, just like Gopher is not what you use to surf the web today, PHP and
basic JavaScript might not be how you write web applications going forward.
But you will come back to all the basics and you will appreciate all the basics.
Okay, enough, enough, enough, enough.
But, classics, the classics matter and
just because it isn't the thing you ultimately use,
doesn't mean that it didn't contribute profoundly to your understanding.
Back to JavaScript and object orientation.
So this is a beautiful piece of code right here.
So, you don't have a keyword called class.
So every other language that we've looked at so far has the keyword class,
which just says, we're starting an object.
That's not how it works.
We are in effect using additional features of functions to implement the object
oriented pattern, okay?
And so, we just say to function, this is creating a named function.
And then in this function,
every time we create it we're going to get a new instance of it.
So remember the class is the template.
The instance is this instance that we have.
And in it, we're going to have data and code.
And like virtually all object oriented patterns, when you have multiple
instances, and you're in the code of the class, you have to have this,
that point to whichever of the instances you're currently working on.
And we'll talk about that more in a second.
And so, when this function starts, when you call it with this new, and so the new,
this is the keyword it says let's take the PartyAnimal template and
let's make a new instance of it.
Let's make a second one.
We could actually call this function, but it doesn't work the same way.
So we say new and it says, lets make a copy of this [SOUND] and
now we got one of these things, and then we're actually going to run it.
So it's going to come in here, and this is pointing to it.
And so this .x, the dot is the object running the operator in most languages.
Again, that's kind of a c structure influence.
This .x basically says, let's make a variable named x and stick that in there,
only let's put a 0 in there.
And that's how you put attributes, and that seems instinctive enough.
But this next set of code, this .party, means we're going to make a function,
a method, inside of this object.
And it's going to have code in it.
This is the first class function bit, and I probably should use a different color.
This is a function definition, and you'll notice there's no name here.
Sorry, [LAUGH] I need an eraser too.
There's no name.
There could be function Bob, could be function Sarah, whatever, but it's not.
It's an anonymous function because, really,
the name of the function is going to be under party.
So we got this object with x in it and party in it.
And inside that is all this code.
X has a 0 in it, this has code.
And again, that this is pointing at whichever one we're talking about.
And so we can look at the member variables.
The instance variables at that same time, and so within here,
we can see the x that belongs to our current thing.
And we're going to add one to it and then we're going to print it out, okay.
And so, what happens is, now this just creates a template,
it doesn't really run code, it makes the template.
And so by calling new party animal, it's not just party animal, it's making
the function code, making a copy of this, making a copy of all that code.
And then setting it up with x and party inside of it.
And then, Storing it in an.
So an is now a pointer in this instance, Or object.
And now we're going to call an.party once, twice, three times, which means,
we're going to call party within this, not this one but within this instance,
call the party, and that's going to increment 1.
So, [COUGH] Yeah, we said all that stuff.
So if this runs, It's going to define the template,
create the object, and point to the object.
It's going to have an x and party inside of it.
Now it runs down here and calls party, which means it runs this.
So this x goes from 0 to 1 and then prints it out.
So it prints that out.
And it comes back down here.
Does it again, [SOUND] then does this again.
[SOUND] Now it comes to so part 2 and 3.
So that's the basic mechanism.
And again, sort of the real beauty of this is,
this notion here of anonymous functions and
the fact that this can be made an assignment statement into that variable.
That's cool.
You can do this whole concept of taking function code and
assigning it to variables outside of objects as well.
That just means that, the function keyword whether it's here or
here can return the code that makes up the function.
And we name it by sticking it in a variable.
It's just so pretty.
And so all other language like Python and Java,
they sort of create this additional structure.
Whereas all they did, all Brendan Ike did in JavaScript is said functions
are going to be first-class citizens where they're just data anyway you go.
And this is inspired by things like Smalltalk, And
Lisp, this kind of equivalence between data and code.
Comes from the sort of the more pure side of OO.
So there's kind of two OO things, there or sort of like this pure one, and
then there's kind of like a bunch of syntactic cruft.
I hate to say Python, PHP, and Java and C++ are on the cruft thing.
A Smalltalk, LIsp, and JavaScript, Of all things, cruddy little JavaScript,
little thing that we just do to make fun stuff happen in the browser,
has kind of like the more pure and more beautiful object oriented pattern.
And again, that's why it's a great language to eventually learn, but
only when you are ready to understand it.
Okay, so the next thing I want to talk about is sort of this object life cycle
and then more than one instance, and how that all works.
Explore nosso catálogo
Registre-se gratuitamente e obtenha recomendações, atualizações e ofertas personalizadas.
O Coursera proporciona acesso universal à melhor educação do mundo fazendo parcerias com as melhores universidades e organizações para oferecer cursos on-line.
© 2018 Coursera Inc. Todos os direitos reservados.
