Posts

Showing posts from April, 2021

iterators and generators

 it is a loop where it doesn't print all values until we give command to print console . log ( "working" ) let   array =[ 1 , 2 , 3 , 4 , 5 ] let   itr = array [ Symbol . iterator ](); console . log ( itr . next ().value) console . log ( itr . next (). value ) console . log ( itr . next (). value ) console . log ( itr . next (). value ) console . log ( itr . next (). value ) console . log ( itr . next (). done ) if you want to dont print 2 and want to print other console . log ( itr . next ().value) itr . next (). value console . log ( itr . next (). value ) console . log ( itr . next (). value ) console . log ( itr . next (). value ) console . log ( itr . next (). done )

how to play audio using js

  console . log ( "working" ) var   audio  =  new   Audio ( 'audio.mp3' ); function   go (){ setTimeout (()  =>  {               audio . play ();           },  4000 ); }

regulkar expression

//padhne Tarika //regex accepts the string as mentioned in regular expression and apply the regular expression //functions and acts accordingly by looking the function working pattern //scans the string word by word console . log ( "working" ) let   regex = / ^ rajiv/    //if expression i.e string match with regex than it will gives true in down case else statement is executed  regex = /boy $ /   //if ends with boy than it gives true:in eg. else but if /ege$/ if statement execution regex = /r.ji/    //if there is any letter between a-z(only one could be any * / not necessarily be...

regular expression functions

 exac,test,match,search,replace //   /something/ gives only 1st place index of something position // console.log("working") // let reg= /rajiv/ // console.log(reg) // console.log(reg.source) // let str="is rajiv a good boy ? don't you know it rajiv" // let result=reg.exec(str) // console.log(result) // let result1=reg.exec(str) // console.log(result1) //output: ["rajiv", index: 3, input: "is rajiv a good boy ? don't you know it rajiv", groups: undefined] //   /something/g gives any position  index of something position // let reg= /rajiv/g // console.log(reg) // console.log(reg.source) // let str="is rajiv a good boy...

fetch api using async await

 1. fetching simple text file from local storage async   function   go (){      try  {          const   promiseobj =  await   fetch ( "data.txt" );      console . log ( promiseobj ) if  (! promiseobj . ok ) {      throw   Error ( promiseobj . statusText ) } else {      const   nextobj = await   promiseobj . text ()      console . log ( nextobj ) }     }  catch  ( error ) {          console . log ( error )     } } 2.fetching simple json file from local storage async   function   go (){      console . log ( "clicked" )      const   obj =   await   fetch ( "data.json" )      console . log ( obj )   ...

fetch api using promise then

1. to fetch text data from local storage        let   variable = document . getElementById ( "click" ) variable . addEventListener ( "click" , gg ) function   gg (){      console . log ( "clicked" )      const   promiseObj = fetch ( 'data.txt' )      console . log ( promiseObj )      promiseObj . then ( function ( data ){          console . log ( data )          if ( data . status != 200 ){             throw   Error ( data . statusText )         }          return   data . text ()     }). catch ( function ( error ){          console . log ( error )     }). then ( function ( f...

async and await

 it is nth. but changing final function of promise  function   add ( a , b ){      return   new   Promise ( function ( resolve , reject ){          setTimeout (() => {              console . log ( "hello" )              resolve ( a + b )         }, 2000 )     }) }; function   show ( ok ){      console . log ( "sfhljl" )      console . log ( ok ) } async   function   showfinal (){      let   var1 =  await   add ( 10 , 20 );      console . log ( var1 )      let   var2 = await   multiply ( var1 );      console . log ( var2 ) } showfinal () console . log ( "end" )

promise

 simply to handle callback hell   function   multiply ( h ){      return   new   Promise ( function ( resolve , reject ){          setTimeout (() => {              resolve ( h * 2 )         }, 2000 )     }) }; function   add ( a , b ){      return   new   Promise ( function ( resolve , reject ){          setTimeout (() => {              console . log ( "hello" )              resolve ( a + b )         }, 2000 )     }) }; function   show ( ok ){      console . log ( "sfhljl" )      conso...

calback hell

if there is callback inside callback than the execution of all program takes much time and is irrelevant this case is called callback hell first addition  \second multiplication callback hell is solved by promises function   callback ( a , b ){      console . log ( "multiplication is" + a * b ) } function   wow ( a , b , callback ){      let   c = a + b      console . log ( "addition of " + a + "," + b + "is" + c )      callback ( a , b ) } function   add ( a , b , wow ){      setTimeout (() => {          wow ( a , b , callback )              }, 2000 ) } add ( 2 , 3 , wow ) console . log ( "done" )

use of callback function

  //there are some case where the output wont be present //in this case y value will be undefined function   add ( a , b ){      setTimeout (() => {          return   a + b ;     }, 2000 ) } let   y = add ( 2 , 3 ) console . log ( y ) console . log ( "done" ) //thus to prevent this error we use call back function // still result is seen but after execution of other code function   wow ( a , b ){      console . log ( a + b ) } function   add ( a , b , wow ){      setTimeout (() => {          wow ( a , b )              }, 2000 ) } add ( 2 , 3 , wow ) console . log (...

set timeout and cleartimeout(asynchronous)

 set timeout acts as a clock or alarm:  if you want your clock to trigger after 5 sec thank set timeout triggers after 5 sec syntax:  setTimeout(function,time): here function is the function of css or HTML you want to target      eg: if you want to change the background of ul after 5 sec than      // function changecss(){ //  document.getElementById("change").style.backgroundColor="red"; // } // setTimeout(changecss,3000);  this  function can be made short by using arrow function or keeping the function in same place 1. using function in same place // setTimeout(function changecss() { //  document.getElementById("change").style.backgroundColor="red";      // }, 3000); 2. using arrow function var   i = setTimeout (() => {      document . getElementById ( "change" ). style . backgroundColor = "red" ; }, 2000 ) CLear timeout...

for each loop

 syntax: array_name.forEach(function(name,index){ console.log(name); console.log(index); }) console . log ( "start" ) let   array =[ "ram" , "shyam" , "hari" , "gita" ] // array.forEach(function(name,index){ //  console.log(name) //  console.log(index) // }) array . forEach ( function ( name ){      console . log ( name ) })

arrow function

 you can simply remove function name and write arrow function:  syntax: var show=function show(a,b){     c=a*b;  console.log(c); } show(10,20) to var show=(a,b)=>{ c=a*b    console.log(c);   } show(10,20) console . log ( "working" ) // var func=function what(a){ //  console.log("what are you trying to do"+a) // } // func(12) // var func1=()=>{console.log("hello buddy")} // func1 // var func1=(a,b,c)=>{ //  d=a+b+c; //  console.log("your ans is"+d) // } // func1(10,20,30) //arrow function with default parameters // var func1=(a,b,c=30)=>{ //  d=a+b+c; //  console.log("your ans is"+d) // } // func1(10,20) // var func1=(a,b)=>{return a*b} // c=func1(10,20) // console.log(c) var   show =( a , b ) => { r...

callback function

 it is just a function call inside a  function console . log ( "helloworld" ) // function multiply(a,s){ //  console.log(a*s) // } // function declare(callback){ //  var a=10; //  var b=30; //  callback(a,b) // } // declare(multiply)// call first you want to do in this case you need to declare and only call multiply // function multiply(a,s){ //  return a*s // } // function declare(callback){ //  var a=10; //  var b=30; //  c=callback(a,b) //  return c // } // d=declare(multiply) // console.log(d) // function multiply(a,s){ //  console.log(a*s) // } // function declare(callback){ //  var a=10; //  var b=100; //  callback(a,b) //...

AJAX and importing JSON file and printing each of the items of json

  function   gg (){      console . log ( "you clicked the click button" )      let   xhr =  new   XMLHttpRequest ();      xhr . open ( "GET" , "load.json" , true );      xhr . onprogress = function (){          console . log ( "progress" );           //you can add spinner over here     }      xhr . onload =  function (){          let   obj = JSON . parse ( xhr . responseText )          //document.getElementById("change").innerHTML=JSON.parse(xhr.responseText)        console . log ( obj . fruits . length )         // console.log(obj.fruits[0])   ...

ES6 class inheritance

 syntax:  class Father{ } class Son extends Son{ }

class and its inheritance

 class Employee{ constructor(name,age,college){ this.name=name; this.age=age this.college=college } showname(){         return 'hello i am '+this.name } add(a,b){ return a+b } } let e1= new Employee("rajiv",20,"ACEM"); console.log(e1.showname()) console.log(e1.college) console.log(e1.add(2,3)) here the methods inside constructor is object but other functions outside the constructor inside the class are prototye