Section 4 (Javascript): Lesson 2 - Syntax

Published: 07 June 2023
on channel: ximxim
4
0

Hey you and welcome.

In this video, we will take a look at the syntax and file of JavaScript.

So let's dive right into it.

I have a sample JS file that I wrote to show a sample of what a JavaScript file would look like and

I've opened that in VS code and JavaScript file typically is written from top to bottom and that's how

it will be executed and it's in English, so it's left to right.

And in JavaScript we would write comments for some of the files so we can see at the top we have a comment,

it's a multi-line comment.

And to start a comment you can do a multi-line comment especially would be a slash star.

So we can do slash star.

That's a multi-line comment and we can end it with star slash and whatever comment go in the middle

you can write and it's multi-line.

So it continues a single line comment, which is on line number nine right now.

That is just a slash slash.

And if I write a comment and go to a next line, if I write something, it is in different color.

Reason for that is because it's part of JavaScript file.

That means it will be executed.

Comments are ignored, however, the code will be executed.

So that's what a single line comment would look like.

There's another comment for Multi line, which is a star star, which is the one I prefer.

If I do slash star star, you can see that VS code is helping me out, finishing me finishing my comment

with a star slash and if I press enter it automatically adds some comment for me based on the function

and I can keep adding more lines and comments.

It's just a little bit better than a regular multi-line comments with the slash star.

Just a preference thing.

Of course, both of them work and comments are ignored by JavaScript when they're executing it, so

it's mainly just for humans to interact with each other.

When somebody else is looking at your code, if there's something that is not explained in the code,

you can just write a comment and explain that a little further.

As you can see on line number 16, size 18 for a bottle that is in ounces, as you can see.

But that doesn't mean anything to the code, but it means a lot to whoever may be reading it.

And same thing on line number 20 and 21.

The measurement is in inches.

Next, let's talk about indentation in the file.

As you can see, we have some spaces at the beginning of some lines, but not the others.

Like line number 14 has no spaces in the beginning, but line number 11 has two spaces.

Line number 20 has four spaces.

What do these mean?

That's what an indentation in a file would would look like.

And it's only for other developers to read the file in a much more user friendly way.

Computer doesn't care about that.

A computer could easily execute a JavaScript without any spaces.

That's usually what happens.

It's called minified JavaScript and we don't need any spaces, any line breaks and it could just execute

this one line all in one shot.

But for humans we need to be able to read that properly.

So we add something called a style guide, and the style guide would say that there should be a space

in the beginning of equals to and at the end of the equals to parentheses should not have spaces.

But if there's a curly like this, then there should be spaces.

That's called a style guide, a preference of what your project should look like.

So we are we are all on the same project, are writing the same kind of code.

Nobody's writing code differently than the other people.

And that's what Indentation would help with too, is readability.

So you can see on line number ten, that's a function update bottle and that function has a body and

the body is indented with two spaces.

So we know there's a function declaration and the body is just one line.

If there were more lines, you can read that easily that this these three different lines would be body

of the function and same thing on a line number 20.

We have four spaces here.

And the reason for that is because the parent is the bottle object.

But then there's another child called Dimensions that has two spaces and dimensions has a child, two

children that would have four spaces.

So it keeps indenting further and further, makes it look like a waterfall.

All right.

So that's indentation and style guide in JavaScript files.

Next, the semicolons you can see in all over the place under line number 11, line number 12, we have

semicolons and line number 34 has semicolon as well.

JavaScript doesn't care about semicolons.

It does support them, but it's optional.

You can opt out of it and in some cases you would.

In my case I work with semicolons, so that's why my style guide says that.


On this page of the site you can watch the video online Section 4 (Javascript): Lesson 2 - Syntax with a duration of hours minute second in good quality, which was uploaded by the user ximxim 07 June 2023, share the link with friends and acquaintances, this video has already been watched 4 times on youtube and it was liked by 0 viewers. Enjoy your viewing!