Is Javascript the culprit ? The story of Javascript: Part 1

Is Javascript the culprit ? The story of Javascript: Part 1

·

6 min read

A long long time ago, websites were boring. They could only show text and images, like a digital newspaper. You couldn’t click buttons to make things happen, scroll smoothly, or see instant updates. Everything was static.

Then, in 1995, a programmer named Brendan Eich was given just 10 days to create a new language that could make websites interactive. And that’s how JavaScript was born.

At first, JavaScript was used for small things like showing alerts and checking forms. But over time, it became super powerful and now helps build:
Websites (like Facebook, YouTube)
Servers (using Node.js)
Mobile apps & games

Today, JavaScript is everywhere, making websites fun, fast, and interactive. What started as a quick project is now one of the most important programming languages in the world. So let’s dive deep into Javascript and try to learn its principles.

What happens when you try to run your Javascript code?

Your JS code when starts to run, it turns into a process.

Your OS can provide some extra stuff also to make this a process.

Since, our JS code is loaded into RAM, and RAM is a storage device, so RAM has it’s memory. Due to this very reason your process has access to this memory.

Now your JS code is capable to store DATA. Means JS now has storage capabilities.

And to store data in our JS code, we can use something called as variables.

What are variables?

Variable are just a kind of a bucket. And what do you use buckets for, storage obviously. Similarly variables are also used for storage.

What happens when you create a variable → It created a bucket in memory and in this bucket we will be able to store data. You can create multiple buckets in memory.

Now if we can create multiple buckets in memory. How will we uniquely identify each of them.

Answer is by naming → Every bucket has it’s unique name. → This name is called as variable name.

Can we create infinitely many buckets? The answer is no because we have limited RAM.

Using this variable name, you will be able to fetch, update and store the data in your variables.

How to create these variables in JS?

Using keywords. Now what are keywords, keywords are reserved words in any language that are used to implement the feature they represent in that language. In JS the keywords that we use for creating variables are let, var and const.

let a = 5; // a bucket got created in memory named a storing the data 5
var b = 30; // a bucket got created in memory named b storing the data 30
const c = 18; // a bucket got created in memory named c storing the data 18

console.log(a); //5
console.log(b); //30
console.log(c);//18

Now how do we fetch the data stored with these variables?

Every language provides us with some mechanism to display data over to the terminal. JS has console.log(); to do the same. It means whatever you want to “log“ into your “console“ goes inside console.log();

A question may come, why do we even need this terminal. So back in the time when we did’t have these beautiful GUI’s for interacting with the machine. Terminals were used to access the functionalities of the machine. This was called as command line interface.

Since eventually our goal is to make an application using JS and tools related to it. So why not just take an example of an application and try to visualize what we have learnt today.

Let’s take example of this very famous flipkart application.

What all data you can see here?

  • Name of the product

  • Availability

  • Price

  • Description

If we think this page has many types of data, like numbers, text etc….

And since we someday want to reach there and build products like this, we need to understand something called as datatypes.

Datatypes

Datatypes define the classification of different different type of values that we can store in our program. JS gives us some data types which are:

  • number

  • string

  • undefined

  • null

  • boolean

  • bigint

  • symbol

This might seem very overwhelming but it’s now. Let’s try to understand these by actually creating variables and storing data similar to above product page of flipkart.

let productPrice = 4438483;//number
let productDiscount = 15; //number
let productName = "Apple Iphone 13"; // to store random text/string
let productAvailability = true; //two state value: true or false

Every language has its own set of Datatypes. It’s not necessary for other languages to have same data types support as JS.

Now there are some rules to create these variables:

  • variable name can contain englist alphabets, digits, underscore, and dollar. No other character and be used

  • variable name cannot start with number/digit.

  • variable names are case sensitive

  • you can used a keyword for a variable name.

Now let’s dive deep into these datatypes.

Numbers

8,-10,33,4.5656, 0, -0, NaN(not a number)

Strings

"hello bhai" "i am 12 years old"

Boolean

Boolean is a two state value meaning it can store only two types of values which are true and false.

true or false

Null and Undefined

These two datatypes are quite quirky. Let’s understand these with an example

Think of null and undefined like ordering food at an Indian restaurant.

Undefined → “not even ordered“ → variable has been declared but never defined.

now what is this declaration and definition:

  • Declaration introduces a variable or function without assigning a value or implementation.

  • Definition allocates memory and provides a value (for variables) or body (for functions).

Let’s take an analogy →

  • Imagine you go to a restaurant and sit at a table.

  • The waiter hasn’t even taken your order yet.

  • Since you never ordered, no food is served.

In JavaScript: A variable is declared but not assigned any value.

let food;
console.log(food); // Output: undefined

Null → “Ordered but cancelled“

null represents no value or nothing. That is variable is declared and defined also. But with an empty value. i.e. null.

  • You go to the restaurant and order biryani.

  • But later, you tell the waiter to cancel the order.

  • Now, the restaurant knows you intended to order something but changed your mind.

In JavaScript: A variable is explicitly set to null to show "empty on purpose".

let food = null;
console.log(food); // Output: null

NOTE: You can use null and undefined by just writing these words just like keywords. If you put them under quotes then they become string. So keep in mind.

What is actually the relevance of these two datatypes null and undefined? → These two datatypes give a sense of emptiness.