Hello and welcome.
In this lecture we are going to be creating the functionality for our to do app using JavaScript.
All right.
So we are in our JavaScript file so we are going to be creating several functions inside these JavaScript
file that will perform various task.
The first function function I am going to create here is going to fetch from the database the to dos
that have already been defined.
All right.
So we're going to start there create a function was whose main task is to go to the database and retrieve
the to do list that are in the database.
And we're going to implement this using local storage because we're going to be storing the data inside
our web browser.
Okay.
Here is the function I have defined.
This function is going to be used by all the other functions that will be created later.
So what this function is going to do as you can see there is no parameters passed in if not passed in
any parameters.
The main purpose of this function is to fetch the content of the to do list which would be a key in
the local storage.
So it would be using the cat item method which is this method to retrieve the To Do List to to do items
that inside this local storage.
So if this is the first time the function is called the specific local storage entry will probably be
empty.
OK.
And the local storage to get item call will return.
No.
That means it will return empty.
So line phone here I've introduced an if statement.
So basically what the if statement is saying that if the return value is not no.
That is if it is not empty then it must be the String String defined data which has been stored.
All right.
So the Jason here the JASON That pass is used to convert the Jason string back into a javascript data
that the browser can display.
The return here on Slide 7 is used to when you create a function you can also specify a return value.
So if there is any data in the database this return value here will return the data that's in the local
storage.
So the function here you define a function by type in the name function followed by the name you want
to give the function.
I've given it a name of get on the score to dos and line two and three are basically variables are created
assigned to the variables to dos set it to equals to a new array an array can combine multiple variables
as one line three again created another variable called to dos on the score SDR which cancels string
and offset it to recourse to local storage to get item method on past it the to do which is it's variable
here.
Okay I've explained the line 4.
So if the to dos this variable here is strictly this exclamation.
And W equals means strictly if it is strictly not empty then return then you get this and convert it
using this to JavaScript.
Okay ma'am pass it this variable here and return whatever you find in the data database that's what
that saying.
So I've created another function from line 10 to 20.
This function is called add.
All right.
So what the function will do the function is it will be called when the user or visitor or clicks on
the button.
Okay.
So when the button is clicked on it will get it would trigger this method here.
Document.
Okay element part d I need to it is passed in task the task which is the value here is what you find
in the hasty AML which is this task here.
That's the idea is talking about it will get that and then add the value that has been inputted so it
will use that and retrieve the value that the user has typed in.
All right.
So then we what what it then does it cause to get on line 13 there.
It's called I've Got a variable called to dos which is of course to get to dos.
So he calls it get to dos we retrieve the already existing to do items from the database.
All right.
And then when.
And then it is appended to the array using the push method.
So this push method is used to append to a list that is to add to a list using the push method.
So saying for these variables are touched this method and any task does been listed you add if there's
any more task you need to add appended to the existing list.
So the push is used to add a pen.
So once the a new list is appended it is saved to a local storage using the local sorry dot set items
the top set item is what is used to store it inside the local storage so to store that.
What we need to do first we use the string of fi that we have to string ify the array.
OK so the using the Jason dot string defined method.
What that does when we store enables us to store the returned string using the local storage to set
item method.
I have called a function here.
Sure but we've not implemented written that function yet but this is where we also call the function
from so later on we'll write a function called Show.
All right.
Notice notice we've got a return value here called force.
So what that does it avoids any for their actions generated by the click event so even though the users
click it will avoid any further action.
That's what that means.
What I'm gonna do is split this lecture in two fully javascript because he's gone on a bit long so I'm
going to stop this lecture here and we'll continue in part 2.
Thanks for watching.
Bye for now.