JavaScript Crash Course in 7 days — Day 1

3 min readNov 11, 2021

How JavaScript works and its Data Types.

Recap

On the Day 0, we already gone through the benefits of learning JavaScript and steps to learn JavaScript in 7 days.

You can read the previous article here JavaScript Crash Course in 7 Days — Day 0

How JavaScript Works

JavaScript is a Client-side Scripting Language. That means it is a computer programming language that runs inside an Internet browser.

The way JavaScript works is interesting. Inside a normal Web page you place some JavaScript code . When the browser loads the page, the browser has a built-in interpreter that reads the JavaScript code it finds in the page and runs it.

Simply you have to put a script tag in your HTML file or can include external JavaScript file in your HTML and start writing JavaScript code in it.

Inline JavaScript in HTML file (index.html)

<html>
  <head>
  </head>
  
  <script>
   //JavaScript Code
   alert('my first prog.')
  </script>  <body> 
   Hello Word !!
  </body></html>

External JavaScript File(index.html)

Create a main.js file parallel to HTML file and include it in the HTML file. You can write all your JavaScript code in main.js file now. Keeping HTML and CSS in separate files is good approach.

<html>  <head>
   <script src="./main.js"></script>
  </head>  <body> 
   Hello Word !!
  </body></html>

Single Threaded, Synchronous

JavaScript is a single threaded technology, it has only one thread to work. One thread means it can do only one work at a time and no parallel processing is possible. So, JavaScript works synchronously, it executes code line by line in a synchronous manner.

This means it has one call stack and one memory heap. As expected, it executes code in order and must finish executing a piece of code before moving onto the next.

Drawback of synchronous approach is that if a task is taking long time it will block the main thread and will cause the delay in the execution of complete code.

Example: If we have to fetch some data from the server via a API call, it will block the process till API returns the data.

To solve this problem, Browser helps the JavaScript. Browser provides the Web APIs that is also used to run the JavaScript code. Now web APIs and JavaScript thread can work in parallel.

Example: Main thread will give task of fetching the data from the server via API call to the Web API. Till Web API fetch the data from server, main thread can execute the other code. Web API will fetch the data from the server and provide the results to the main thread for processing.

Similarly, any process that requires browser helps can be executed parallel like time interval, timeout, API call etc.

Data Types

JavaScript provides different data types to hold different types of values. These are divided into two segments.

Primitive data type.
Non-primitive (reference) data type.

JavaScript is a dynamic type language, means you don’t need to specify data type of the variable. It will automatically use the data type depending upon value assigned to it.

var a=40; //holding number

var b=”Rahul”; //holding string

Primitive data type.

1. Boolean type

Boolean represents a logical entity and can have two values: true and false.

Example: var userExist = true;

2. Null type

The Null type has exactly one value: null.

var total = null;

3. Undefined type

A variable that has not been assigned a value has the value undefined.

var a;

Data type of a is undefined.

4. Number type

ECMAScript has two built-in numeric types: Number and BigInt

The Number type is a numbers between -(2⁵³ − 1) and 2⁵³ − 1

var sum = 100;

5. BigInt type

With BigInts, you can safely store and operate on large integers even beyond the safe integer limit for Numbers.

var x = 2n ** 53n; 9007199254740992n

6. String type

JavaScript’s String type is used to represent textual data.

var name =”manish”

7. Symbol type

A Symbol is a unique and immutable primitive value and may be used as the key of an Object property. In some programming languages, Symbols are called “atoms”.

Non-primitive data type.

1. Object

In JavaScript, objects can be seen as a collection of properties. It can keep the different information about a entity. For example

var student = {name: “Robin”, class: “12”}

object could be nested

var student = {personal-details: {name: “Robin”, address: “Delhi”}, academics: {class: 12, rollNo: 21}}

Array are also an object in JavaScript.

Var arr =[1,2,3,4,5]

You can read the previous article here JavaScript in 7 Days — Day 0