JavaScript Basics — For Beginners

Designed by slidesgo / Freepik

JavaScript is one of the most popular programming languages. Approximately, there are 12.4 million active JavaScript developers in the world. It’s a programming language for the web.

Today I have described some JavaScript and ES6 basics for beginners.

1. JavaScript Data Type:

There are different types of data types in a JavaScript program-

String: It represents text data.

Example:

let name = ‘Mahbubul Alam’;

Number: It represents integer and floating-point data.

Example:

let number1 = 12;
let number2 = 12.5;

BigInt: It represents arbitrarily large integers data.

Example:

let maxInt = 900719925124740999n;

Boolean: It represents two values, true and false

Example:

let nameOne = true;
let nameTwo = false;

undefined: It represents a data type whose variable is not defined.

Example:

let x;

null: It prevails a null value.

Example:

let y= null;

Symbol: It represents a data type that is unique and immutable.

Example:

let greetings = Symbol(‘hello’);

Object: It represents key-value pairs of the collection of data.

Example:

let friend =
{
id : 1,
name : ‘Mahbub’,
}

2. JavaScript Comments:

There are two types of comments in JavaScript. Those are Single-Line Comment and Multiline Comment.

Single-Line Comment: It represented by a double slash(//)

Example:

//Declare a variable
var num = ‘11’;
console.log(typeof num); //string

Multiline Comment: It start with /* and end with */.

Example:

const fruits = [“Banana”, “Mango”, “Orange”, “Apple”, “Dragon Fruit”];
fruits.forEach(fruit => console.log(fruit));
/*
Output:
Banana
Mango
Orange
Apple
Dragon Fruit
*/

3. Error Handling:

If you are a programmer, you will always face error, no matter you are a junior or senior programmer. Most of the time these errors are never understood. But if you use try and catch method you will understand those error messages. The try statement allows you to test a block of code for errors and catch statement allows you to handle the error.

Example:

const fruitsCollection = [‘Apple’,’Mango’,’Banana’];
try{
console.log(fruitsCollections);
}catch(error){
console.log(error.message); //Show an error message ‘fruitsCollections is not defined’
}

4. Arrow Functions:

Es6 introduces us arrow function which is the alternatives of traditional JavaScript function.

Example:

//Traditional Function
function sum1(num){
return num+1
}
console.log(sum1(1));
//Arrow Function
const sum2 = (num) => num+1;
console.log(sum2(2));

5. Cross browser testing:

Cross browser testing is to test the functionality of a website or application in multiple browsers. It can be done in mobile or web applications. This type of testing done manually or using tools like-SeeTest, browsersshot, Multibrowser etc. Cross browser testing is necessary to enhance the usability and quality of an application.

6. Spread Operator:

JavaScript ES6 provides us with a new kind of operator called Spread operator. The spread operator is marked by three dots(…). It is used to expand or spread an iterable or an array. It copies the elements of an array and pastes it into another one.

Example:

const numbers = [5,6,7,8];
const spreadNumbers = [1,2,3,4,…numbers];
console.log(spreadNumbers);// [ 1, 2, 3, 4, 5, 6, 7, 8]

7. Destructuring:

Destructuring is a feature that came along with ES6. It is allowing us to unpack data from arrays or objects and assign them to variables.

Example:

// Destructuring an array
const numbers = [1,2];
const [a,b] = numbers;
console.log(a,b); //1,2
// Destructing an object
const colors = {one:’Red’, two: ‘Black’};
const {one,two} = colors;
console.log(one,two); //Red Black

8. Default Function Parameter:

If a function starts with a parameter with a value, it is called a default function parameter. If you do not initialize a parameter with some value, then the default value of the parameter is undefined.

Example:

function getName( name=”Limon” ){
console.log(“Hello”, name);
}
getName();// Hello Limon

9. Rest Parameter:

Rest Parameter is also introduced in JavaScript ES6. It is written by three dots (…). It is taken infinite number of arguments as an array into a function.

Example:

function takeNumbers(…numbers) {
console.log(numbers); //it took all the value as an array
}
takeNumbers(10,20,30); //Passing values

10. typeof() Operator:

typeof() Operator returns the type of a value. If you wan to check data type of an value, then you can use typeof() operator.

Example:

const number = 1;
const name = ‘Limon’;
const isTrue = true;
console.log(typeof(number)); //number
console.log(typeof(name)); // string
console.log(typeof(isTrue)); //boolean