Javascript Fundamental Concepts

Today we are going to look at some javascript fundamental concepts and Block Bindings. So, let’s start with data type:

1. Data Type in JavaScript:

There is some sort of data type in javascript such as null, undefined, string, number, symbol, boolean, bigInt, and primitive values. There are two different data types also and they are object and function. Objects and Functions​ are also values, but they are not primitive. If you do console log some sort of code in the browser console you will see some differences between primitive values and non-primitive values. Have a look:

How to find type:

In Javascript, you can find the type of data by using typeof() method. Look at the example below:

Expressions:

Any unit of code that can be evaluated to a value is an expression. ​The expression always results in a single value.​ Expression in javascript can be divided into categories.

• Arithmetic expressions
• String expressions
• Primary expressions
• Array and object initializers expressions
• Logical expressions
• Left-hand-side expressions
• Property access expressions
• Object creation expressions
• Function definition expressions
• Invocation expressions

Handling errors:

Sometimes we write code with error and our code stops the execution immediately. But there is a solution for that. By using try…catch syntax we can find the error and code execution will not stop immediately because of that error. The syntax looks like

try{
  // code
}catch (err){
  // handle errors
}

1. The code in try{} will execute first.
2. If there no error occurs the catch{} statement will be ignored.
3. if any error occurs in try{} then code execution will be stoped and go to the catch{} statement.

Stye-code:

We should write code clean and human-readable. If we write code very complex it will be difficult to understand. Look at the two examples below:

1. At first look at the first one:

2. Now look at the second one:

Which one is easy to read and understand? Absolutely the second one is clean and easy to understand. So, we should follow some style rules for write human-readable and clean code.

some style-rules:

• A space between parameters
• No space between the function name and parentheses between the parentheses and the parameter
• Spaces around operators
• A space between arguments
• Lines are not very long
• An empty line between logical blocks
• Spaces around a nested call
• Curly brace { on the same line, after space

Comment-code:

In javascript, we write a single-line comment using // and multi-line comment using /*….*/. The comment is useful to describe how the code working and why the code is written. But we should not write unnecessary comments in the code. Here new developer became confuses.

Cross-browser testing

Cross Browser Testing is a type of testing to verify if an application works across different browsers as expected and degrades gracefully. It is the process of verifying your application’s compatibility with different browsers.

We all might have observed that some websites are not properly displayed on some browsers and we just think that the website is broken. But, as soon as you open it on a different browser, the website opens up just fine. Thus this behavior explains the compatibility of a website with different browsers. Here’s the cross-browser testing that comes to solve this problem.

Functions with Default Parameter Values

Sometimes when calling a function we forgot to provide all parameters value as arguments. Then the value will be undefined and broke the code. So, if we set a default value for the parameter then if we forgot to provide the arguments it will not break the code because there have a default value have a look code below:

Here we provide just one argument in the doSum() function. But this code will be work still. If we provide 2 arguments for the doSum() function then the default value will be ignored and the second argument takes that place.

Spread Operator

Sometimes we need to maintain our existing data. Let say, we don’t want to modify the data we have and want to add new data in a new collection or an object with the previous data. Here we can copy our data and make a new collection or object by using the spread operator(…(just three-dot)). Have a look at the example:

Here if we push() new element to the numbers array the existing array will be modified. first, we copied all elements of the numbers array to the new numbers array and then add a new element. That’s why our main data not modified and we also have new data collection with the previous data.

Arrow Function

We can write a function in javascript using the arrow function. In the normal function, we use a function keyword and a return statement. But when we write a function using an arrow then we don't need to use the function keyword. The benefit of the arrow function is if our function returns in one single line then it very easy to write using the arrow function.

1. fist look at the first one

2. Now look at the second one