Share
Explore

WIL: On Javascript (1)

...primarily because I want to carry out a sort of test on how deeply I understand the core principles of the programming language and hopefully get to provide some insights for anyone who stumbles on this.
My journey into coding has been an on-again, off-again type of relationship but I started taking it seriously in March when the lockdown and WFH due to the Coronavirus pandemic kicked in fully.
I started off with what can arguably be considered the table stakes (for frontend development) - HTML and CSS - using Codecademy, FreeCodeCamp and YouTube.

Now that I have started taking classes on Javascript, I thought to document my learnings after every module, primarily because I want to carry out a sort of test on how deeply I understand the core principles of the programming language and hopefully get to provide some insights for anyone who stumbles on this.

Also, I put together a bunch of music for you to enjoy while you read.

Loading…


🔴 What is Javascript?

Javascript is popularly known as the programming language of the web. It started out as a way to add small bits of functionality to a website, now its functions have evolved into much more.

The language now supports the:
Ability to create business applications on the web
Ability to create any kind of utility, security or data application
Ability to communicate with Browser Application Programming Interfaces (APIs)
Ability to communicate with third-party APIs
Ability to rapidly build sites and native applications using third-party frameworks and libraries


🔴 Adding Javascript to HTML

A Javascript code can be added to an .html file by making use of the
script
tag and then inserting it inside the
body
tag of the .html file.

<body>
<p> I am ready </p>
<script>
alert('hello world!');
</script>
</body>

It is common to use the
script
tag with the source attribute set to an external Javascript file.

<script src="./home.js"></script>

It is best practice to have the Javascript code in a .js file and HTML in a .html file, that way there is good separation of concern.


🔴 Commenting Code

This is important to avoid any form of ambiguity in your code when another developer picks it up. Any kind of complexity, trickiness or indeed anything that could be confusing should be commented on in your code.

Single line comment can be added using a double
slash
.

// single line comment

A multiple line comment can be added using a
slash
and
star
before the comment and a
star
and
slash
after the comment.

/* multiple line comment */


🔴 Variables

Essentially, Javascript are containers for storing values.

Any application that is being written depends on data (f
or eCommerce, we need data on the product e.g product name, price and all the data that belongs to an invoice or a purchase order. Same applies for an application that works within a car, games etc
), in Javascript variables are used to hold this information.

Screen Shot 2020-05-15 at 11.53.41 AM.png
source: pluralsight


🔴 Declaring Variables

Letting Javascript know what variables will be used is termed declaring variables.

When declaring a variable, a keyword (a special symbol that Javascript knows about and performs some type of action)
let
is used. After the keyword
let
, we have the variable identifier that we want to use, then an equal sign, followed by the value of that variable.

let total = 149.99;
let product = 'hiking boots';
let discounted = true;

From the above code snippet, you will notice that the value assigned to the variable
product
is enclosed in quotation marks, the reason is because
hiking boots
is a string and computers don't recognize strings without quotation marks, this however doesn't apply to numbers as seen in
total
. While for
discounted
,
the absence of quotation marks is as a result of the assigned values being
Boolean values
as they are used so often that Javascript recognizes them by default.

Rules For Naming Variables

A variable name (also known as identifier) can begin with "
_
", "
$
" , "
letter
" and subsequent characters can be digits (
0
9
)

let _2total = 149.99;
let $to_tal = 149.99;
let total99 = 149.99;

You cannot begin a Javascript identifier with a number.

let 5total = 149.99;


🔴 Constant

While the
let
keyword is used to declare variables with dynamic values,
const
keyword is used to declare variables whose values are static (i.e the value of a constant can't be changed through reassignment, and it can't be redeclared).

An advantage of using
const
is that it helps guide other developers looking at your code in the future giving them a clue that something is not suppose to change.

const price = 149.99;
price = 50.99;
ShowMessage(price;
console.log (err);
// expected output: TypeError: invalid assignment to const `number'

const price = 149.99;
ShowMessage(price);
console.log(price);
// expected output: 42

The next set of Javascript learnings I'll be embarking on and documenting are:
Types and Operators
Program Flow
Feel free to drop a comment for me if you spot anything off and will like to point me in the right direction. I'll appreciate that.

Thanks to Bisi and Seun for helping out with the edits.
Share
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.