WEBVTT

00:00.000 --> 00:04.000
Key JavaScript components

00:04.000 --> 00:07.000
In this video, you will understand

00:07.000 --> 00:10.000
Key JavaScript components used in code

00:10.000 --> 00:13.000
Understanding control structures

00:13.000 --> 00:20.000
In the previous video, we developed a webpage using HTML, CSS, and JavaScript

00:20.000 --> 00:25.000
Now let's understand the key components of JavaScript with the help of the same code

00:25.000 --> 00:28.000
Let's understand functions and events

00:28.000 --> 00:30.000
With this part of the code

00:30.000 --> 00:32.000
Functions

00:32.000 --> 00:36.000
A function is a block of code that does something when we tell it to

00:36.000 --> 00:41.000
It helps us reuse code without writing it again and again

00:41.000 --> 00:45.000
Function is the key word used to define a function

00:45.000 --> 00:48.000
Button clicked is the name of the function

00:48.000 --> 00:54.000
The code inside curly brackets runs when the function is called

00:54.000 --> 01:00.000
Events happen when users interact with the webpage like clicking a button

01:00.000 --> 01:05.000
On click is an event that triggers the button clicked function

01:05.000 --> 01:08.000
Variables and data types

01:08.000 --> 01:13.000
A variable stores information that can be used later

01:13.000 --> 01:16.000
Let is used to declare a variable

01:16.000 --> 01:19.000
Message is the name of the variable

01:19.000 --> 01:23.000
Thank you for clicking is a data type that is in string format

01:23.000 --> 01:27.000
Other data types include array, list of items

01:27.000 --> 01:30.000
Object, group of related data

01:30.000 --> 01:33.000
Embedding JavaScript in HTML

01:33.000 --> 01:38.000
JavaScript can be added directly inside an HTML file to make the webpage interactive

01:38.000 --> 01:40.000
It can be included in three ways

01:40.000 --> 01:44.000
Inline, internal external

01:44.000 --> 01:47.000
Do you remember which type of JS is this?

01:47.000 --> 01:50.000
Inline or external?

01:50.000 --> 01:52.000
That's right, inline

01:52.000 --> 01:55.000
The second is an internal JavaScript

01:55.000 --> 02:01.000
And third is external JavaScript as it is the link of an external file attached

02:01.000 --> 02:03.000
Control structures

02:03.000 --> 02:07.000
Control structures help a program make decisions and repeat actions when needed

02:07.000 --> 02:10.000
If, LC statements

02:10.000 --> 02:15.000
Check a condition and execute different instructions based on whether it's true or false

02:15.000 --> 02:16.000
Loops

02:16.000 --> 02:20.000
Repeat a task multiple times without rewriting code

02:20.000 --> 02:25.000
This method keeps the JavaScript code separate from HTML

02:25.000 --> 02:28.000
Making the code cleaner and easier to manage

02:28.000 --> 02:31.000
These are some key JavaScript concepts

02:31.000 --> 02:34.000
Try experimenting with them in your own code