Java script

1. Conditional statement :- if else, switch case

2. Looping :- for loop, break, continue, nested for loop, while and do while loop

Do practice pattern questions , foreach loop =>

this loop gives values of array one by one by storing in a callback function ,more at 5.7

3. Array = Linear data structure, colletion of similar data types.

Multidimensional array = Array under array let ar = [1,24,5,[3,4,6]];

4. Loop in array :- For of loop => to print index value of the array

For in loop => to print index address of the array

4.1 Array methods :-

a. push() => adds new value in array in the last.

syntax => arr.push(value)

b. unshift() => adds new element in the start.

syntax => arr.unshift(value)

c. pop() => To remove any element from the array at end, if it is printed then it give the
removed value

syntax => arr.pop(), console.log(arr.pop())

d. shift() => To remove any element from the array at start, if it is printed then it give the
removed value

syntax => arr.shift(), console.log(arr.shift())

e. tostring() => It returns string elements from the array separated by the comma (,), used by
creating a new variable and calling it

syntax =>let x = arr.tostring()

console.log(arr.tostring())

f. join() => Works same as tostring, we can use separators by our choice

syntax => let x = arr.tojoin('|'), print the variable

here pipes are the saparators

g. includes => to check that the element is present or not in the array and give the answer in
boolean T or F

syntax => console.log(arr.includes(50))

h. concat() => To join the two arrays

syntax => let x = x.concat(y), it joins the x array from y.

i. splice => to remove element from more than one idx

splice() => arr.splice(idx, no of ele to remove, no to add new)

arr.splice(1,3,24)

j. arr[idx] =value, to update array idx

5 Function :-

5.1 Normal function =>

function name() {

// block of code

5.2 function with parameters

function name(a, b){

// block of code

here a and b are parameters for input data or other operations, we can use default parameters that
is (a, b=6), value for b is given if eternally any parameter is provided dis replaces this default
parameter

5.3 Return type function

function name() {

return // block of code

it means it does not print any value until is store at other var and call it

5.4 Arrow function

let name=(a,b) => //block of code;

Here the function is created by arrow(=>)

writng return is mandatory if curly braces {} are used

5.5 this keyword:- this keyword is represent different behaviour at different places

example :- when it is used in function

let obj = {

name : "tanish",

course : "b.tech",

cinfo:function () {

console.log(this.name)

obj.cinfo()

this => here it represent the object

 this.name => here this keyword represents element

when it is used in arrow funciton

let obj = {

name : "tanish",

course : "b.tech",

cinfo:() => {

console.log(this)

obj.cinfo

here it represents window object

5.6 Callback function=>

when a function is called within a parameter then it is called callback function

let displayData=(res) => {

return res

let sumData=(num1, num2, result) => {

return result(num1+num2)

let outPut = sumData(10,50, displaydata)

console.log(outPut);

here the funntion displaydata is called in result parameter and the vlaue of result in sotred in the
displaydata function

5.7 foreach loop =>

 this loop gives values of array one by one by storing in a callback function

example => let l= [3, 42, 54, 64, 63]

l.foreach((v.i) => {

console.log(v,i);

})

here the elements are stored in a anonymous function (functon which has no name), the
elements are stored in first paramenter and the index value in second

5.8 map() =>

This function creates new array using existing elements of previous array by performing any
operation, it creates array with same no of elements in the previous, if 5 ele in prevoius the new
will be 5

example => let arr = [10, 20, 34, 43, 53]

let finalans = arr.map((v,i) => v+5)

console.log(finalans)

output = [15,25,39,48,58]

The seprate callback fundtion wil be :-

let calculate = (v,i) => {

return v+5

let finalans=arr.map(calculate)

console.log(finalans)

5.9 filter() =>

 This function does not creat another array but replace its elements for the given conditions or it
sorts the element for given filter , does not change the value of elements

example :- let arr = [11,22,33,55,66]

let arrfilt= arr.filter((v,i) => v%2==0)

console.log(arrfilt)

output => 22,66

5.10 reduce() =>

This function do some operations on array and give single element

example => let l = [10,20,30,40,50]

let final = l.reduce((total,v,i) => total+v)

console.log(final)

output => 150

here the parameter totoal stores the final answer, v stores the elemets for arr and i stores idx values.

In the final variable the sum of v and i stored in the totla paramenter and after completing the
function the value of total get printed.

6 Document Object Model (DOM) =>

This model represents the graph of the html elements

6.1 Calling elements by id =>

We can call elements by their id

Example =>

<h1 id="heading"> Welcome to CDGI <b>INDORE</b></h1>

let head = document.getElementById('heading')

console.log(head)

in head var h1 tag content is called by their id heading

console.log(head.innerText) :- for getting only inner txt

console.log(head.innerHTML) :- for getting inner text with innter html tags like indore under b tag

let para = document.getElementById('pg')

para.innerHTML=head.innerHTML; :- here the content of heading are stored in para tag

6.2 Using events =>

Events are things that happen in the system you are programming, which the system tells you about
so your code can react to them.

<input type="password" id="pass">

<button id="btn" onclick="showhidepass()">SHOW</button>

let password = document.getElementById('pass');

let button = document.getElementById('btn')

function showhidepass(){

if(btn.innerHTML=="show"){

password.type="text";

btn.innerHTML="hide";

} else {

password.type="password";

btn.innerHTML="show";

Here on clicking the password show and hide

6.3 Add Event Listener =>