JavaScript

Aditya Maurya
5 min readJun 22, 2022

What is JavaScript ?

JavaScript is a scripting language that enables you to create dynamically updating content, control multimedia, animate images

Why we need node.js or browser to run JS codes ?

Because using JS we make real-time projects so we need something to see real-time Outputs of our Work.

Print

console.log("Hello…");

variable declaration

let username = "Aditya Maurya"let user_Mobile = 3948298989var name = "Aditya"const id = 20192

Reserved Keywords :-

  1. function

2. let

3. new

4. return

5. enum → Future Reserved Keywords

6. implement

7. interface

8. package

9. private

10. protected

12. public …

Is JavaScript is Compiled or Interpreted language ?

JIT :- Just in Time

Interpreted language

Object in JS

var book = {
name : "Inspirational Life",
price : 599,
author : "Aditya Maurya",
publisher : "Arihant"
}

Arrays

var roll = [10,20,30,50]roll.push(90);roll.pop();roll.unshift(70); //insert 70 at beginningroll.shift();roll.forEach((i) ⇒ console.log(i)) // makes changes in array itself not return anythingroll.map((i) ⇒ console.log(i)) // map return a new array with specified changes

function :-

1. Function in JavaScript

function go(a,name){
a += 1;
console.log("Hello Agent ",a," ! Nice to meet you ", name)
}
var a = 67;
go(a,"Aditya");

2. Iteration in Function

function detailed(items){
for(var i=0;i<3;i++){
console.log(items[i].name, " ", items[i].roll)
}
}

Array of objects :-

item =  [
{name : "A", roll: 10},
{name : "B", roll: 30},
{name : "C", roll: 40}
]

detailed(item)

3. Returning Function

function returingFun(a,b){
return a+b;
}
console.log(returingFun(4,60))

ES6 : ECMAScript 6 and 7 are best

4. ES6 way of writing function :

Arrow Function → 🔖🔖🔖 “A variable storing a function” 🔖🔖🔖

Syntax :-

const/var function_name = (params) => {
code
return
}

RECOMMENDED TO USE const not var : as we don’t want to that function to be get overridden.

Example :-

const go2 = (p,q) => {
function t(){console.log(this);} //Calling other function
return p + q
}
console.log(go2(10,20));

More about Objects :-

const food = {
name: "Burger",
price: 740,
company: "Panda Pizza"
}
console.log(Object.keys(food))
console.log(Object.values(food))
console.log(Object.entries(food))

Suppose my Object contain some value that should not be changed

Eg:- Customer should not able to change the Price of above food Object

Object.freeze(food);food.price = 200 // should not workconsole.log(Object.entries(food))

Default Parameter :-

function t1(name = "default"){
console.log(name);
}
t1(); // "default"

Template literals :-

var n = "Aditya"const greeting = `Hello ${n}!` ;
//Using BackTick instead of str1 + str2 …
console.log(greeting);

Synchronous and Asynchronous :-

Synchronous:- Work in REAL-TIME, No Delay or work on this task now and stop others. Block the upcoming request and process the current process, then proceed.

Asynchronous:- Delay in Work or doing work in the Future. If any Process is going to take time to move it to the processing Queue in which it will do its work of collecting data and until that JS will work on other Processes.

Promises in JS :-

To implement Asynchronous in JS, we use Promises.

Ajax :- Asynchronous JavaScript and XML.

It was an old way of connecting or talking to a server but get replaced by Promises as Ajax provides less security, long code, etc.

Things needed to talk with the server :-

  1. HTTP request :- “fetch” is JS function takes URL and makes a request.

Example :- API call to Server with JS

We are using a sample Server from Jsonplaceholder.com :- “users” having 10 data.

URL :- https://jsonplaceholder.typicode.com/users

fetch :- Used to GET data from giver URL
then :- If Getting data is Successful, then do this.
JSON :- JavaScript Object Notation, helps in formatting data from Server so that it can be read and processed easily.

VIDEO 1:- Concept Understanding

VIDEO 2:- Code Understanding

Copy and test the Code :-


// promises : This is Async
fetch("https://jsonplaceholder.typicode.com/users")

.then((result) => result.json())
.then((data) => console.log(data))

.catch((error) => console.log(error))


//Resolve :- .then
//Reject :- .catch is used to prevent App crashing


// Async Await :- In promises JSON is Async task, so we added .then again in next line.
// But what if we have multiple Async task then we have to add a lot of .then, which is tedious. Here, comes Async Await

//It is Syntactical sugar for promises.

async function getData1() {
try{
const result = await fetch("https://jsonplaceholder.typicode.com/users");
// result telling go get this data i am wating for it
const data = await result.json();
// data telling go get this data i am wating for it
console.log(data);
}catch(error){
console.log(error);
}
};

//Arrow Function
const getData2 = async () => {
try{
const result = await fetch("https://jsonplaceholder.typicode.com/users");
// result telling go get this data i am wating for it
const data = await result.json();
// data telling go get this data i am wating for it
console.log(data);
}catch(error){
console.log(error);
}
};

getData1();
getData2();

let vs var :-

var can be re-declared again and again, even within Scope.

let can not be re-declared again and again, even within Scope.

Here, name2 have scope same, so we are getting error.

So, we can conclude that using “let” is good as it will only allow a variable to be declared once in a scope, i.e., it is a block-scoped variable.

Thanks For reading….

KEEP CODING AND EXPLORING…..

--

--

Aditya Maurya

Software Engineer || Fitness Freak || Content Creator || Explorer