JavaScript Fundamentals

As a front end developer we should have strong knowledge in javascript fundamentals. Today I will discuss about javascript fundamentals which is very important for web developer.

JavaScript Data Types

Data types basically specify what kind of data can be stored and manipulated within a program. There are six basic data types in JavaScript which can be divided into three main categories:

1. Primitive Data Type
2. Composite Data Type
3. Special Data Type

String, Number, and Boolean are primitive data types. Object, Array, and Function are composite data types. Whereas Undefined and Null are special data types.

The String Data Type

The string data type is used to represent textual data (i.e. sequences of characters). Strings are created using single or double quotes surrounding one or more characters.

Example:

var a = ‘Hello World’; // Using single quotes

var b = “world World”; // Using double quotes

The Number Data Type

The number data type is used to represent positive or negative numbers with or without decimal place, or numbers written using exponential notation.

Example:

var a = 25; // integer

var b = 80.5; // floating-point number

var c = 4.25e+6; // exponential notation, same as 4.25e6 or 4250000

var d = 4.25e-6; // exponential notation, same as 0.00000425

The Boolean Data Type

The Boolean data type can hold only two values: true or false. It is typically used to store values like yes (true) or no (false), on (true) or off (false).

Example:

var isReading = true; // yes, I’m reading

var isSleeping = false; // no, I’m not sleeping

The Undefined Data Type

The undefined data type can only have one value-the special value undefined. If a variable has been declared, but has not been assigned a value, has the value undefined.

Example:

var a;

var b = “Hello World!”;

console.log(a) // output is undefined

console.log(b) // output is Hello World

The Null Data Type

This is another special data type that can have only one value-the null value. A null value means that there is no value. It is not equivalent to an empty string ("") or 0, it is simply nothing.

A variable can be explicitly emptied of its current contents by assigning it the null value.

Example:

var x = null;

console.log(c) // output is null

Arrow Function

Arrow function is one of the features introduced in the ES6 version of JavaScript. It allows you to create functions in a cleaner way compared to regular functions.

Example:

let sum = (a, b) => {

let result = a + b;

return result;

}

let result1 = sum(5,7);

console.log(result1);

Let vs Const in JavaScript

In JavaScript, we commonly declare variables using two keywords: let and const.

When should we use one vs the other?

I always default to using const.

Why?

Because const guarantees the value can’t be reassigned.

When programming, I always think that the best thing that I can use is the thing that can harm me the least.

We have an incredible amount of things that can generate problems.

The more power you give to something, the more responsibility you assign to it.

And we don’t generally want that.

Well, it’s debatable, of course, as everything. I don’t want that, and that’s enough for me.

If I declare a variable using let, I let it be reassignable:

let number = 0
number = 1

and in some cases this is necessary.

If I want the variable to be reassignable, let is perfect.

If I don’t, which is in 80% of the cases, I don’t even what that option be available. I want the compiler (interpreter, in the case of JS) to give me an error.

That’s why I default to const every time I declare a variable, and only switch to let when I want the reassign ability to be allowed.

ES6 Promises

Promises have mainly three states that are as follows:

Pending: It is the initial state of every promise. It represents that the result has not been computed yet.

• Fulfilled: It represents the completion of an operation.
• Rejected: It represents the failure that occurs during computation.

Once the promise is fulfilled or rejected, then it will be immutable. The Promise() constructor takes two arguments that are rejected function and a resolve function. Based on the asynchronous operation, it returns either the first argument or the second argument.

What is try/catch block in JavaScript

A try / catch block is basically used to handle errors in JavaScript. You use this when you don’t want an error in your script to break your code.

While this might look like something you can easily do with an if statement, try/catch gives you a lot of benefits beyond what an if/else statement can do, some of which you will see below.

try{
//...
}catch(e){
//...
}

This is basically how a try/catch is constructed. You put your code in the try block, and immediately if there is an error, JavaScript gives the catch statement control and it just does whatever you say. In this case, it alerts you to the error.

All JavaScript errors are actually objects that contain two properties: the name (for example, Error, syntaxError, and so on) and the actual error message. That is why when we alert e, we get something like ReferenceError: getData is not defined.

Like every other object in JavaScript, you can decide to access the values differently, for example e.name(ReferenceError) and e.message(getData is not defined).