all right if you've actually managed to
sit through and watch all of these
videos about all of these different
functions I'm kind of amazed and really
the truth isn't that the point of what
I'm doing is not to like because there's
a lot more of these array functions is
did I say this already in a previous
video but is not to go through all these
one at a time and explain every single
one as useful as that possibly might be
in some cases but if you can kind of
understand how they work and then figure
out how to look up in the reference in
the documentation you can look at all
the array functions to figure them out
for yourself but I'm here let's do one
more one more really useful one let's
talk about sort so I'm gonna come back
over here
I'm gonna save I'm gonna come back to
this word stuff cuz we're gonna need
that in a second but let's just look at
the let's just look at this array of
vows for a second so I'm gonna say
console.log boughs and I'm just gonna
say vows sort with no function passed in
and console dot log Val's so let's see
what happens and let me give this the
number nine I'm gonna hit refresh and we
can see look at that
it's sorted it in numerical order from
lowest to highest
that's ascending order and in fact it
didn't make a new array it sorted
exactly that array so this is important
to realize this is a distinction that
we've really got to pay attention to so
far in looking at these filter makes a
new array reduce well reduce doesn't
make an array it reduces things down to
a single but could make an array but
that's a special case reduce and map
make a new array Phil fills an existing
array and sort sorry filter and map new
array Phil and sort act on an existing
array reduces a special case so that's
kind of important distinction between
all of these so but how did it know to
do that well sort you kind of like would
say like oh I sort it should sort by
numerical order and if these were words
you know a Hello be goodbye you would
guess it's gonna sort them in
alphabetical order now if this is
capital B that shows up first because
it's actually going to sort by capital
letters first if there was something
else that I was going to look at here
I'm gonna say capital B yeah if it's
also like numbers and letters it's gonna
first put the numbers and then it out in
numeric order and then the letters in
alphabetical order so there are there's
a default way that an array will be
sorted now let's let's look at this case
what if I had just an array of objects
so what if my array was actually
something like a bunch of XY pairs so
this is now an array and I oughta format
it for me of two objects each with an x
and a y well what if I sort that well it
didn't change didn't change the order
five six to ten all right well let's be
sure about this let's say to ten five
six and let's do it again to ten is
first well that's there and now after
sorting it to ten it's the same order so
this is the thing there is a default way
of sorting stuff but JavaScript the sort
function only knows that default way for
certainly kind of obvious things like
numbers and strings if you want to sort
something yourself you need to write
your own comparing function this is why
sort is a higher order function because
it expects the sort function expects as
an argument a function which you could
call the compare or the comparator it's
not actually a word I just feel like
there's all sorts of goofiness in Java
with these like long winded strange
words but you need to write a function
that compares and what does that
function look like so let's come back
over here so let's say for this
particular case here what I wanted to do
is I wanted to
this by the y-values so I would write a
function I'm gonna call it compare and
it's going to compare two elements this
higher-order function requires two
arguments two elements of the array and
it's your job to say which one should go
before the other and the way that you
can tell the way that you can tell the
sort function to do that is by returning
a positive or negative number and I can
never remember which is which but
positive maybe means a goes before B
negative means B goes before a and zero
means they're equivalent or it's the
other way around
I always just try it both ways and
eventually I figure it out so for
example I could say return a dot Y minus
B dot Y right that makes sense because
in this case we're going to have 10
minus 6 is 4 or 6 minus 10 is negative 4
so if I put that compare function right
here in Val's
and I hit refresh we're going to see
that 6 comes before 10 let's change this
to B minus a and we're gonna see that 10
comes before 6 I know this is small but
can you see that 10 comes before 6 so
this and if they're equal
but that valley is gonna be 0 so what
other ways can we have fun with this
well let's go back to let's go back to
this it was a dark and stormy false
night who's trying to league that's
false let's put this back in here and
let's say what I did with filter in the
previous video is I filtered out all of
the words after I split up this text
that were less than 3 characters and
let's just split out let's let's
actually well 3 or less so let's make it
2 or less so let's just make sure this
still works we can see Oh Val's is not
too fine I'm gonna gonna comment this
out I'm not using that anymore so I'm
just gonna look at this code and I'm
gonna see ok so that's my was dark and
stormy night now if I were to just say
right before hear words dot sort
I would get and dark stormy and dark
night stormy was but what if I wanted to
sort by the lengths of the words so I
would we need to write a compare
function and so I could start doing this
with function compare a comma B return
but here's the thing I'm trying to use
as much as possible this arrow syntax to
be able to sort of in line right there
have the function that doesn't compare
all in one line in very condensed way
let's try to do that maybe we've done it
I've done it enough times now they don't
need to write it first as a long winded
function then make an anonymous function
then an arrow function let's do it all
at once so I'm going to I'm gonna say
we're word Ono so this is a comma B try
always for up so this is the the the
sort that compare function requires two
arguments two elements of the array that
I'm going to compare I'll keep this a
and B sort of variable naming that's
totally arbitrary I could call it cat
and dog then I want to return the the
difference between the lengths if one if
one's length is bigger than the other it
should be after it so I'm gonna say B
and I don't need to say return I'm just
gonna say B dot length minus a dot
length so this should this should give
me now a way of sorting the array where
the longer ones appear at the end and
let's see I probably got this backwards
I always get it backwards
I got it backwards of course where the
longer ones are at the beginning so you
know I could have figured that out but
in the end I could just say a minus B
and then there we go was and dark stormy
so you can see three letter three letter
for letter five letter five letter so
this is the way that you can sort you
can sort custom any list of any array of
stuff based on however you want to
compare two elements of that array all
right now I'm trying to think if there's
anything else I have to say I think
that's it so we were done we've gotten
through all this stuff what I want to do
now is I want to look at taking a lot of
these concepts into a kind of creative
classic creative coding scenario
a particle system and using a
higher-order function to write a bunch
of ways of managing to do a bunch of
things to manage that array of particles
and I'll do that in the next video which
you might may or may not choose to watch
thanks very much
[Music]