INTRODUCTION
Creating the front end of a web page requires using tools like Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript. JavaScript is a programming language that allows you to add interactivity and dynamic functionality to a web page.
Front-end developers employ the popular programming language JavaScript to make webpages interactive. When an instruction is requested, Java Script instructs the computers what to perform and executes that command.
Consider an e-commerce site where the product you have chosen is immediately added to the cart when you click the add to cart button. JavaScript is carrying out this command.
An additional example of how JavaScript is used is in a smart home, where the instructions have been established so that when someone enters the house, the lights turn on, and when they depart, the lights turn out. The lights turn on as a result of instructions being delivered, which can be accomplished using JavaScript.
Are there other programming languages? Yes, they are but JavaScript is the main language used for the interactivity and dynamic functionality of a website.
Read this article on the history and origin of JavaScript
Setting up the Development Environment:
The different options for running JavaScript code include:
using a web browser
using an Integrated Development Environment (IDE)
The following steps are required when using a web browser to run JavaScript code:
Open a new tab on your browser
Right-click on the web page
Click on inspect
Click on the console
Clear out the error message
Type your code
What is an IDE?
An integrated development environment is a tool developers use to write, edit, and manage their code more efficiently. Examples of some of the IDEs are:
The following are the steps required to use Visual Studio Code to run JavaScript code:
- Download Visual Studio Code
- Install Visual Studio Code
- Create a Folder inside the document folder on your computer
-
Open your VS Code.
To open your VS code do the following:a. Click on File
b. Click on Open your folder
c. Click on the File icon to create a JavaScript file
d. Type in the name of your file
e. Install Quokka in your VS code
Note:
Your file name must end with a .js extension. e.g newTask.js
Read this article to learn more about Quokka
Variables in JavaScript
Variables are containers used to store values. You can think of variables as a box that contains various items.
Items like books, clothes, kitchen utensils, and so on can be stored in a box. In JavaScript, these items are called values and they are of different data types.
Data is a collection of facts and information to be examined and used for decision-making. This data is categorized into:
Numbers
Strings
Bigint
Boolean
Null
Undefined
Arrays
Object
Consider this equation:
let X = 5.
In JavaScript, this means that X is a container that holds 5.
Declaration of Variable
JavaScript is case-sensitive so when declaring variables take note of your words.
The different keywords used when declaring variables are:
Automatically
let
const
var
e.g let firstName;
"Let" is the Keyword while "firstName" is the variable name.
Assigning Values to variables
The assignment operator (=) is used to assign values to the variable. Think of a woman who wants to relocate to another city; she could pack all her clothes in a red leather bag and kitchenware in a paper box. She chooses what each box should hold. Variables store different values as a result of the assignment operator. The variable remains empty if the assignment operator doesn't assign it any values.
Example 1: let firstName = “Sandra”
Naming variables
There are different ways of naming variables and they include:
Camel Case.
Snake Case.
Pascal Case.
Camel Case: This is the practice of writing where each word or abbreviation after the first word begins with a capital letter with no punctuation or spaces
Examples:
let firstName
let multipleUserName
const secondJourney
Snake Case: This is the practice of separating different words with an underscore. The words are written in lowercase.
Examples:
var my_car
const the_three_numbers
Paschal Case: This is the practice of writing the first letter of the words in uppercase.
Examples are:
let UserAccount
const FullName
Note: Do not try to use the different styles on the same project. Choose a style and stick with it.
Arithmetic Operators in JavaScript
There are different types of operators in JavaScript but this article will focus only on arithmetic operators.
In JavaScript, the arithmetic operators used to perform operations on number data type:
ARITHMETIC OPERATORS
(+ Addition)
(- Subtraction)
(* Multiplication)
(/ Division)
(% Modulus)
(** Exponential)
(++ Increment)
(-- Decrement)
Examples:
Using (+) operator
let x = 18;
let y = 30;
console.log(x + Y)
output: 48
Using (-) operator
let priceOfShirt = 400;
var priceOfTie = 150;
console.log(priceOfShirt - priceOfTie)
output: 250
Using (*) operator
var m = 40;
var n = 8;
console.log(m * n)
output: 320
Using (/) operator
const unitsOfBags = 200;
var priceOfBags = 5;
console.log(unitsOfBags / priceOfBags)
output: 40
Using (%) operator
let a = 50;
let b = 6;
console.log(a % b)
output: 2
Using the exponential operator
Conclusion
You have started the process of learning JavaScript by becoming familiar with these key ideas. To further develop your skills, keep in mind to practice writing code, look into alternative sources, and look for real-world applications.
As a constantly changing language, there is always more to learn about JavaScript. You will therefore be well on your road to becoming a JavaScript developer if you keep exploring and trying new things.
Top comments (0)