JavaScript is called the language of the web. If you want to become a web developer you have to learn JavaScript. But, learning JavaScript is not that easy.
So, to make the process of learning JavaScript a little easier I am writing this JavaScript Ultimate guide series. In this series, we’ll discuss javaScript from the fundamentals to the advanced, including ES6, OOP, Asynchronous JavaScript, and many more.
This is Part 1. In this part, I’ll discuss the fundamentals of JavaScript. I’ll cover concepts like variables, functions, loops, and conditionals.
Table Of Content
01. Variables
Variables are a way to store data for later use. In JavaScript, you can declare a variable in three ways.
Using var
, let
, and const
.
Var, let and const have their different use cases. Here’s a quick overview:
Var: var is the old way of declaring a variable. It is compatible with all the older browsers.
Let and const: these were introduced in 2015. If you want to change the value of the variable use Let. And if you don’t want to change the value use Const.
Learn more:
https://javascript.info/variables
https://www.freecodecamp.org/news/var-let-and-const-whats-the-difference/
02. Data Types.
Every data in javaScript has a type. For example, a number is a number type and a text is a string type.
There are 8 data types in JavaScript:
- String: Represent text-based data.
- Number: Represent Numbers. An integer or a floating-point number.
- BigInt: Represents arbitrary length of integer.
- Boolean: True or False value
- Undefined: Value of a data whose value is not assigned yet.
- Null: Represents unknown values.
- Symbol: Represents unique and immutable values.
- Object: Key-value pairs of data
Learn more:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures
https://www.programiz.com/javascript/data-types
03. Operators.
Operators perform operations on two or more data values and produce a result.
There are a lot of operators in javaScript. Here’s a quick overview.
- Assignment Operators: =, +=, -=.
- Arithmetic Operators: +, -, *, / and %(modulo operator).
- Comparison Operators: ==, !=, ===, !==. >, <.
- Logical Operators: &&, || and !
Learn more:
https://www.programiz.com/javascript/operators
https://javascript.info/operators
04. Conditionals.
In JavaScript, you can write conditional with If-else, if-else if-else.
You use the comparison operators to make the decision.
example:
const age = 18;
if (age < 18) {
console.log("Alice is under 18 years old.");
} else if (age >= 18 && age <= 21) {
console.log("Alice is between the ages of 18 and 21.");
} else {
console.log("Alice is over 21 years old.");
}
Learn more:
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals
https://www.freecodecamp.org/news/javascript-if-else-and-if-then-js-conditional-statements/
05. Functions.
Functions are reusable blocks of code. Once you declared a function you can call it anywhere you want.
You can declare a function in JavaScript with the function keyword. Like this:
function showMessage() {
return "Hello World!";
}
You can call a function by just calling the function name with a set of parenthesis.
ShowMessage();
Learn more:
https://javascript.info/function-basics
https://www.programiz.com/javascript/function
6. Loops
Loops are a way to repeat an action in programming. In JavaScript, you can write loops in 5 ways.
Here’s a quick overview.
- for — loops through a block of code until the counter reaches a specified number.
- do…while — loops through a block of code once; then the condition is evaluated. If the condition is true, the statement is repeated as long as the specified condition is true.
- for…in — loops through the properties of an object.
- for…of — loops over iterable objects such as arrays, strings, etc.
- while: loops through a block of code as long as a specified condition evaluates to true.
Learn more:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration
https://www.programiz.com/javascript/for-loop
https://javascript.info/while-for
07. Arrays and Objects
Arrays: An array is a special type of variable, used to store more than one value.
example:
const array = [1, 2, 3, 4, 5, 6, 7, 8]
Objects: An object is a data structure that is used to store key-value pairs.
example:
const user = { name: "John", age: 30 };
Learn more:
https://www.programiz.com/javascript/array
https://javascript.info/object
https://www.programiz.com/javascript/object
Conclusion
In this article, I discussed the fundamental concepts of javascript. We talked about, variables, functions, loops, and objects.
In the next part, we will talk about DOM.
To stay in touch follow me on Twitter at @coderamrin
Happy coding.