Shrashti Sharma

Posted on Oct 20

JavaScript From Scratch: Learning One Concept at a Time

#javascript #learning #discuss #ai

                        TITLE - the start

okay so since these are just my blogs , so obviously gonna be so informal but informative so let's begin

JavaScript can be categorized into

DATATYPE :
number
string
Boolean
array
object
undefined
Big int
symbol
null
function
VARIABLE
let
const
var

"npm" - it is used here to include the header files.

nod- resonates the g++ of cpp

JS is a weakly typed than cpp and java they both are dynamically typed ab ye kya hta h dekhte hn-

dynamically typed -
aesi languages jinme datatype agar ek baar define kr diya to uske liye alotted memory box k size becomes fixed now you cannot enter any other datatype in that specified space, ok. for eg:
int a = 10
//in cpp int is provided 32 bits memory so it's fixed , u can't be entering double in it.
weakly typed-
javascript is weakly typed kiuki usme there is variable size matlab you could have made a variable a with no datatype at all and enter any datatype to it. for eg:
input->
a='hello';
console.log(a) ;
a= 1.11;
console.log(a);
output->
hello
1.11
//yhn 'a' took both the datatype values without any issue lekin cpp m krte to error aa jata

# how to print in javascript:
console.log();

for loop k syntax dekh lete hn isme:

input->
a='hello';
for(let i=0;i console.log(a[i]);
}
output->
h
e
l
l
o
ab dekho isme kya hta h ki auto hi new line add ho jati h to usko avoid kene k liye we could
input->
let x="";
for(let i=0;i x += a[i];
}
console.log(x);
output->
hello

while loop b dekh hi lete hain

input->
let i=0;
while(i<a.length){
console.log(a);
i++;
}

output->
hello

Use strict : this is something that mandates you to declare your variable matlab iski vjh s ab humari language thdi discipline m aati h aur uspe restriction ho jati h ki yuhin kuch b variable na ho bina bataye for eg:

a=10 //error
let a =10 // ye chlega kiuki tumne bataya ye varibale h ek type k

arrays (heterogenous type) : idhr python ki list ki trh mamla h koi b datatype h zoo m h . for eg:

input->
let arr = [1, 2, 3, 4, 5];
console.log(arr); //simply print ho jayegi
arr = ['a', 1.11, true, null];
console.log(arr); //simply print ho jayegi
for(let i=0;i<arr.length;i++){
console.log(arr[i]);
} // arrays k element p iterate krenge
arr[10]= 'random'; //koi b index p value de skte hn
console.log(arr); // jin indexes m value ni hgi udhr undefined aayega
for(let i of arr){
console.log(i); //yhn 'of' keyword ki help s b iterate kr skte hn
}

output->
[ 1, 2, 3, 4, 5 ]
[ 'a', 1.11, true, null ]
a
1.11
true
null
[ 'a', 1.11, true, null, <6 empty items>, 'random' ]
a
1.11
true
null
undefined
undefined
undefined
undefined
undefined
undefined
random

object : it is like a collection of key value pair used to store the related information together

for eg:
input->
let obj = {
name: 'John',
age: 30,
isStudent: true,
} // name is key and john is it's value
console.log(obj);
console.log(obj.name); // this prints the pair together
console.log(obj['age']); // this calls for the value at that key
for(let key in obj){
console.log(key + ': ' + obj[key]);
}
output->
{ name: 'John', age: 30, isStudent: true }
name:John
30
name: John
age: 30
isStudent: true

important reminder: we use,

Dot notation: object.name — for property names that are valid identifiers.
Bracket notation: object["first name"] — for any property name, including those with spaces.
input->
let obj = {
"first name":"vaibhav"
name : 'lol'
}
console.log(obj."first name"); //ERROR
console.log(obj.first name); //ERROR
console.log(obj["first name"]); // calls value : vaibhav
console.log(obj.name); //name : lol

random info: typescript is something that puts constraint over javascript

-> it's used to access multiple features like functions, datatypes etc. from other languages like cpp etc.

for -in loop -> object specific

for - of loop -> array specific

for eg:
for(let key in obj){
console.log(key+':'+obj[key]);
}
//returns 'undefined' if the value does not exist for a key

function :

input->
function add(a,b){
return a+b;
}
console.log(add(10,20));
ans= add(20);
console.log(ans);
output->
30
NAN //not a number since b was undefined

function as a datatype:

array shift unshift push pop :

let arr;
arr = [1,2,3,4];
// to Update like: [0,1,2,3,4];
arr.unshift(0); //o/p-> [ 0, 1, 2, 3, 4 ]
// unshift to insert data at front in array
arr.shift(); //o/p-> [ 1, 2, 3, 4 ]
// pop at front in array
arr.push(5); //o/p-> [ 1, 2, 3, 4, 5 ]
// insert at end
arr.pop(); //o/p-> [ 1, 2, 3, 4 ]
// pop at end
// We can add at any index in array of js
arr[8] = "My string"; //o/p->[ 1, 2, 3, 4, <4 empty items>, 'My string' ]

** Browser only understands Javascript and is used to make servers and it is important for development

hoisting :

it says that the code is read twice means all the functions are scanned and took to the top of the code and then the normal code is read. Function/Variable(LHS:declaraction) is done by hoisting. for eg:
before->
hello();
function hello(){
console.log("Hello World");
}
output->Hello World!!!!
after->
// This is for representation purpose only
function hello(){
console.log("Hello World");
}
// ----------------------------

hello();
// console.log(hello());
before->
console.log(a);
var a = 10;
after->
var a;
// ----------------------------
console.log(a); //undefined
a = 10;
console.log(a); //10

scope :

// JS mei scope
// Let : block scope
// Var : functional scope
// What is block?
/*
{
Curly brackets are block
}
/
/
let a = 20
if(a>10){
let x = -100;
console.log(x)
}

console.log(x) // x is not defined...

let a = 20
if(a>10){
var x = -100;
console.log(x)
}

console.log(x)

DEV Community