8-4-2024-11am

You might also like

Download as pdf or txt
Download as pdf or txt
You are on page 1of 26

25-03-2024

workshop 9:30 - zoom.us/j/88999384787

https://chat.whatsapp.com/J7NF0yj1OWD59WgPJ9hHC2
=========================================

Create a Jira account

loggedIn

Scrum

created one site

Variable and functions


Programs
Interview Questions
Assignment - JS program -1(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

1. What is variable ?

to store the data

var name; var/let/contst

default value of the variable - undefined

var name="sachin"

name="sachin"

2. What is function ?

3. What is callback ?

4. What is higher Order ?

5. Tell me some error messages ?

6. programs

1. function fn(){
console.log(a);
}
fn()
-error - a is not defined
2.
function fn(){
var a=10;
}
console.log(a)
-error - a is not defined

3.

function fn(){
var a=10;
}
fn()
console.log(a)
-error - a is not defined

4.

function fn(){
let a=10;
}
fn()
console.log(a)
-error - a is not defined

5.
function fn(){
const a=10;
}
fn()
console.log(a)
-error - a is not defined

6.
function fn(){
a=10;
}
fn()
console.log(a)
-10
7.
var a=10
function fn(){
console.log(a)
}
fn()
console.log(a)

10
10

8. function fn(a,b){
console.log(a+b)
}
fn()
NaN

9. function fn(){
console.log(a+b)
}
fn()
error- a is not defined

10.
function fn(a+b){
console.log(a+b)
}
var result =fn(10,20)
result ?
undefined

11.
function fn(a+b){
return a+b
}
var result =fn(10,20)
result ?
30

12. function fn(a){


a()
}
fn()

a is not a function

13.
function fn(a){
a()
}
fn(10)

a is not a function

14.

function fn(a){
a()
}

function f1(){

fn(f1)

f1 - callback
fn - Higher Order function

15.

function fn(a){
return a;
}

function f1(){
return 10;
}

var result = fn(f1)

result is a variable should be one function , return 10.

16.
function fn(){
function f1(){
return 10;
}
return f1
}

var result=fn()
result()
10

17. How many ways you can call the anonymous functions ?

a. immediate invoking
b. assing to one varibale
c. pass as a callback
18.

function fn(a,b){
a("sachin");
b();
return function(){
console.log("kohli");
}
}

fn type is a function (HOF)


parameters - 2
type a - function
type b - function

return type - function

return value - anonymous function


while calling fn , want output sachin, dhoni, kohli in the console.
can you call fn?

fn(
function(data){
console.log(data)
},
function(){
console.log("dhoni")
}
)()

26-03-2024

1. create sprint in JIRA

2. Create a task add to sprint

3. start the sprint

4. close the sprint

Dat 6:
document, window, getReference, events, eventbubbling, eventCapturing
Programs
Interview Questions
Assignment - JS program -2(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

What is document ?

What is window ?

How to get the reference of elments in JavaScript ?

getElementById
getElementsByTagName
getElemebtsByClassName
getElementsByName
querySelector
querySelectorAll

#header2 > div > div > div > div > div.topnav_cont > a:nth-child(2)

<div id="header2">
<div>
<div>
<div>
<div>
<div class="topnav_cont">
<a>
<a>
</div>
<div>
</div>
</div>
</div>
</div>
</div>

Why we events, tell me some events ?

tell me JS events systax ?

What is event object ?

What is event bubbling ?

What is event capturing ?

Day 7
setTimeout, setInterval, clearTimeout, clearInterval,Debouncing, Throttling
Programs
Interview Questions
Assignment - JS program -3(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

console.log(1)
console.log(2)
console.log(3)

1
2
3

setTimeout
type - function
argument- 3 - handleer , time , ...
return type - number

clearTimeout
type - function
arg- one - number

function fn(a,b,c,d){
}

fn(10,20)

setInterval
type - function
argument- 3 - handleer , time , ...
return type - number

clearInterval
type - function
arg- one - number

var count=10;
var inervalId=setInterval(function(){
count=count-1
gmailRef.innerHTML=count
if(count==0){
clearInterval(inervalId);
alert("timeup...")
}
},1000)

Debouncing....

OOPS(class, object, inheritance, overloading, overriding, abstration,encapslation)


Programs
Interview Questions
Assignment - JS program -4(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

1. What is class ?

2. What is Object ?

3. What is constructor ?

4. What is this ?

5. What is inheritance ?

6. What is abstraction ?
7. What is polymorphism ?
8. What is encapslation?
9. What is overloading ?
10.What is overriding ?
11. class properties ?
12. static keyword ?
13. type of inheritance ?

14. How many ways can we create a class in JS?


15. what super ?
16. What interace?

17.What is prototype in JS ?

18. is Overloading support in JS ?


19. is Overriding support in JS ?
20. concreate class vs abstract class vs interface

function Arth(){
this.n1=10;
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.n1//10
obj.n2//20
obj.sum()//30

obj["n1"] //10
ob["sum"]()//30
=================================

function Arth(){

this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.n1 // undefined
obj.n2//20
obj.sum() // NaN

How to fix ?

Arth.prototype.n1=10;
obj.sum() //30

========================

function Arth(){
this.n1=10;
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.sub()
//obj.sub is not a funciton

How to fix ?

Arth.prototype.sub=function(){
console.log(this.n1-this.n2)
}
=================================
function A(){
this.n1=10
}

function Arth(){
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}

var obj=new Arth();


obj.sum() // NaN

how to fix ?

Arth.prototype=new A();
obj.sum() // 30

---------------------------------

29-03-2024

OOPS(class, object, inheritance, overloading, overriding, abstration,encapslation)


Programs
Interview Questions
Assignment - JS program -4(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

1. What is class ?

2. What is Object ?

3. What is constructor ?

4. What is this ?

5. What is inheritance ?

14. How many ways can we create a class in JS?


6. What is abstraction ?
7. What is polymorphism ?
8. What is encapslation?
9. What is overloading ?

10.What is overriding ?

11. class properties ?


12. static keyword ?
13. type of inheritance ?

15. what super ?

17.What is prototype in JS ?

18. is Overloading support in JS ?


19. is Overriding support in JS ?

20. concreate class vs abstract class vs interface


16. What interace?

function Arth(){
this.n1=10;
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.n1//10
obj.n2//20
obj.sum()//30

obj["n1"] //10
ob["sum"]()//30
=================================

function Arth(){

this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.n1 // undefined
obj.n2//20
obj.sum() // NaN

How to fix ?
Arth.prototype.n1=10;
obj.sum() //30

========================

function Arth(){
this.n1=10;
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}
var obj=new Arth();
obj.sub()
//obj.sub is not a funciton

How to fix ?

Arth.prototype.sub=function(){
console.log(this.n1-this.n2)
}
=================================
function A(){
this.n1=10
}

function Arth(){
this.n2=20;
this.sum=fucntion(){
console.log(this.n1+this.n2)
}
}

var obj=new Arth();


obj.sum() // NaN

how to fix ?

Arth.prototype=new A();
obj.sum() // 30

---------------------------------

class Arth{
var n1=10
} syntax error
================

class Arth{
n1=10;
n2=20;
sum(){
console.log(this.n1+this.n2)
}
}

var obj=new Arth();


obj.n1 //10
obj.n2//20
obj.sum // sum fun
obj["sum"]// sum fun

obj["sum"]() // 30
obj.sum() // 30

=======================
class Arth{
n1=10;
sum(){
console.log(this.n1+this.n2)
}
}

var obj=new Arth();


obj.sum()

NaN

Arth.prototype.n2=20
obj.sum()//30

obj.sub // undefined
obj.sub()// obj.sum is not a function

=======================

class A{
n1=10;
}

class B extends A{
n2=20;
sum(){
console.log(this.n1+this.n2)
}
}

var obj=new B();


obj.sum()// 30
==========================

function A(){
this.n1=10;
}

class B extends A{
n2=20;
sum(){
console.log(this.n1+this.n2)
}
}

var obj=new B();


obj.sum()// 30

Note:
B should be class keyword class
A can be class / function keyword class
==================================

class A{}
class B extends A{}

A - Parent/Super/Base
B - Child/sub/Derived

Single

class A{}
class B extends A{}

Multiple

class A{}
class B{}
class C extends A,B{}

Multilevel

class A{}
class B extends A{}
class C extends B{}

Overloading

function sum(a,b,c){
console.log(a+b+c)
}

function sum(a,b){
console.log(a+b)
}

function sum(a){
console.log(a)
}

sum(1,2,3) // 6
sum(1,2) // 3
sum(1) //1

class Arth{
sum(a,b,c){
console.log(a+b+c)
}
sum(a,b){
console.log(a+b)
}
sum(a){
console.log(a)
}
}

var obj=new Arth();


obj.sum(1,2,3) // as

Overriding

alert("nit")

function alert(msg){
// writted code create popup - 100
// place msg inside the popup
// show the popup
/ /place ok button
}

function alert(msg) {
console.log(msg)
}

class Parent{
property(){
console.log("1cr")
}
}
class Child extends Parent{
property(){
console.log("0cr")
}
}

var obj=new Child()


obj.property()
//0cr

==================================

class A{
constructor(){
console.log("f1");
}
}
var obj=new A()
f1
==========

class Parent{

constructor(){
console.log("Parent");
}
}
class Child extends Parent{

var obj=new Child()

1. extended child class default constructor, they check for parent , if there parenet there
call parent class constrctor

==================================

abstraction

encapslation

==============================

interface vehicle{
createFlyVehicle();
changeColor();
}

abstract class TATA implements Vehicle{


createFlyVehicle(){
----
=====
}
abstract changeColor();
}

class v{
createFlyVehicle(){
----
=====
}
changeColor(){
}
}

30-03-2024
Array methods
Programs
Interview Questions
Assignment - JS program -13(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

1. Array has data or not ?

const players=["Sachin","Dhoni","kohli"]

players.length

obj.name

==============================
var obj={
name:"Sachin"
}

obj.name

//Sachin

another fix

class A{
name="sachin"
}
var obj=new A()

obj.name
//Sachin

==================

var arr=[1,2,3]

arr.push(4)

type- inherited method inside Array class


args- rest parameter(0 to any)
return type- number
return value- new array length

why ? - insert an element(s) in the last index

useCase-
====================

var arr=[1,2,3,4]
arr.pop()

type- inherited method inside Array class


args- 0
return type- any
return value- last index element

why ? - remove an element from the last index

useCase-

==========================

var arr=[1,2,3,4]

arr.indexOf(3) 2
arr.indexOf(2) 1
arr.indexOf(5) -1
arr.indexOf(2,3) -1
arr.indexOf(3,2) 2

type- inherited method inside Array class


args- max 2 - search element, fromIndex
return type- number
return value- -1 to ..

why ? - find index of an element

useCase-

===================================

var arr=[1,2,3,4]

arr.inclues(3) - true
arr.inclues(2) - true
arr.inclues(5) - false
arr.inclues(2,3) -false
arr.inclues(3,2) -true

type- inherited method inside Array class


args- max 2 - search element, fromIndex
return type- boolean
return value- true/false

why ? - element there or not there

useCase-

===================================

var arr=[1,2,3]
arr.unshift(4)
type- inherited method inside Array class
args- rest parameter(0 to any)
return type- number
return value- new array length

why ? - insert an element(s) in the 0th index

useCase-

====================
var arr=[1,2,3,4]
arr.shift()

type- inherited method inside Array class


args- 0
return type- any
return value- 0th index element

why ? - remove an element from the 0th index

useCase-
=====================

var arr=[1,2,353,343,5,56]

arr.slice() [1,2,353,343,5,56]
arr.slice(3) [343,5,56]
arr.slice(3,5) [343,5]
arr.slice(5,3) []

type- inherited method inside Array class


args- max 2
return type- array
return value- part of an array/ []

why ? - get part of an array

useCase- pagination

---------------------------------

var arr=[1,2,353,343,5,56]

arr.splice(2,1)
return [353]
arr - [1,2,343,5,56]
arr.splice(3,2,33,44)
return [5,56]
arr - [1,2,343,33,44]

type- inherited method inside Array class


args- max 3(index,delCnt, restParameter)
return type- array
return value- array of revemoved elements
why ? - modify an array

useCase- remove particular element from array

===========================================

var arr=[1,2,3,4]

arr.forEach

type - inherited method inside Array class


args - 2 - 1st one should be function (callback), callback called by forEach passing 3 args(ele, index,
original array)
return type - no
return value- undefined

why - interate the elements in the array

useCase -

04-04-2024

1. What is runtime error ?

2. What is an exception ?

3. How to handle exceptions in JS ?

4. tell me somethign about throw keyword

5. How to create our own excepitons ?

6. Tell me some ecxception , which you face in your appolicaiton ?

7. Tell me something about the flow of raise the exception?

8. Some predefied exception classes ?

9. R u sure, all the statements inside try block will execute ?

10. R u sure, all the statements inside catch block will execute ?

11. R u sure, all the statements inside finally block will execute ?

12. Write a code snippet , How you hanlde runtime erros in your application ?

Promises,callbacks
Programs
Interview Questions
Assignment - JS program -9(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

callbacks:

Shop:

function printCards(no,text,scb,ecb){
console.log("start printing the cards");
console.log("action going on...");
const isPrinted=true
if(isPrinted){
console.log("${no} cards printed")
scb(no)
}else{
console.log(" cards not printed")
ecb(0)
}
}

college:

printCards(
100,
"nit",
function(cards){
console.log("${cards} received");
console.log("distirbute the cards");
console.log("start and end");
},
function(){
}
)

Primsie
functional class
while createing an object, we should have to pass one function as argument
that argument called by constructor by passing 2 arguments
those 2 arguments are function type

Shop:

function printCards(no,text){

return new Promise(function(resolve,reject){


console.log("start printing the cards");
console.log("action going on...");
const isPrinted=true
if(isPrinted){
console.log("${no} cards printed")
resolve(no)
}else{
console.log(" cards not printed")
reject(0)
}
})

How to get the data from promise object ?

2 ways

a. then method
a. method inside Promise class
b. take max 2 parameters
c. 2 parameters types are functions
d. returns Promise object
b. await keyword
a. keyword
b. fallows always promise object
c. returns promise object success result only
d. failure result can handle using try,catch,finally

cosnt promiseObj=printCards(100,"nit")

promiseObj.then(
function(){
console.log("1st called");
},
function(){
console.log("2nd called");
}
)

=================================

var obj=new Promise(function(resolve,reject){


resolve("sachin");
})

Que: get the output Sachin

obj.then(
function(data){
console.log(data)
},
function(){
}
)

Throttling…

05-04-2024
1. what is asynchronous action ?

2. How to pass the asynchronous action results back to caller ?

3. tell me something about Promsie class ?

4. Did use promises in your application ? tell me some senario

5. How to create primse object ?

6. How to rerieve the data from promise object

7. tell something about then ?

8. tell somethting about await ?

9. tell me some methods inside Promise class ?

10. what is the return type of then, catch , finally ?

11. How to hanlde the success response using then and await ?

12. How to handle failure response from promise object

then(
function(){},
function(){} // failure
)
or
.then()
.catch(
function(){}// failure
)

or
try{
await promiseObj
}
catch(e){}

13. what is async function ?

14. How get handle the return values of async function ?

====================================

var po1=new Promise(function(resolve,reject){


resolve(100)
})

want that 100 as result ?

1.
po1.then(
function(data){
console.log(data)
}
)

2.

const res=await po1

res //100

=================================

var po1=new Promise(function(resolve,reject){


reject(100)
})

want that 100 as result ?

1.

po1.then(
function(data){
console.log(data)
},
function(data){
console.log(data);
}
)

2.
po1.then()
.catch(function(data){
console.log(data)
})

3.
try{
const res=await po1
}catch(e){
console.log(e)
}

=====================================

async function f1(){


return 100
}

get 100 as result

1.
f1().then(
function(data){
console.log(data)
}
)

2.

const res=await f1()

res //100

================================

Promise {<fulfilled>: 100}

to get the above output can you write the code ?

1. Promise.resolve(100)

2. async function fn(){


return 100;
}
fn()

3. new Promise(function(resolve,reject){
resolve(100)
})

======================
Promise {<rejected>: 100}

to get the above output

Promise.reject(100)

new Promise(function(resolve,reject){
reject(100)
})
=================================

Promise.resolve

Promise.reject

Promise.all

Proimse.allSettled

Promsie.any

Promsie.race

Promise.withResolvers
let { promise, resolve, reject } = Promise.withResolvers();

let resolve, reject;


const promise = new Promise((res, rej) => {
resolve = res;
reject = rej;
});

-----------------------------

const po1=new Promise(function(resolve,reject){


// resolve
// reject
})

po1.then(function(){},function(){})
po1.then(function(){}).catch(function(){})
await po1

var oo=new rxjs.Observable(function(obj){


// obj.next
// obj.error
})

oo.subscribe(function(){},function(){})

15. what is observables and syntax

16. Promise vs objservable

06-04-2024

document.cookie="name=sachin" - inmemory

document.cookie="loc=Mumabi;expires=---"

document.cookie="loc=Mumabi;expires=yesterday"

document.cookie=""

converted into array


reducer - object
- retrieve

cookieStore - is an object of CookieStore predefined functional class

CookieStore - predefined functional class which contains


set
cookieStore.set(-,-); cookieStore.set({name:"",value:"",expires:date});
get
cookieStore.get("name") - give us whole cooike row as part of promise object
getAll
cookieStore.get("name") - give all the cooikies as part of promise object
delete
cookieStore.delete(-);
...
method
above all method return the result throught Promise

===============================

BOM - Browser Object Model- location,screen, History, navigator


Programs
Interview Questions
Assignment - JS program -6(write/todo)
Notes -
Write HTML, CSS, Bootstrap,JavaScript Test

https://www.youtube.com/watch?v=CjWJ_8u-nDs&list=PLi0B7bAUSoVtX3IrC09hsZKEorc-
bOW15&index=23
https://www.youtube.com/watch?v=wioAeuUDS1Y&list=PLi0B7bAUSoVtX3IrC09hsZKEorc-
bOW15&index=49

equals(obj1,obj2)

You might also like