JS Data Structures, Modern Operators and Strings PDF

js Data Structures, Modern Operators and Strings Date @02/05/2025 Status To Review Subject 👾 js jonas chapter 9 array destructing: the esx feature...

js Data Structures, Modern Operators and Strings Date @02/05/2025 Status To Review Subject 👾 js jonas chapter 9 array destructing: the esx feature const arr = [1,2,3]; const [x,y,z]=arr; // Skip the second element const [a, , c] = arr; default values const numbers = ; // Provide default values const [a = 10, b = 20, c = 30] = numbers; const numbers = [1, 2, 3, 4, 5]; // Capture the first two elements and the rest const [a, b,...rest] = numbers; console.log(a); // 1 console.log(b); // 2 console.log(rest); // [3, 4, 5] js Data Structures, Modern Operators and Strings 1  for swapping 🍕(short answer!): let a = 1; let b = 2; // Swap values [a, b] = [b, a]; Returning Multiple Values from a Function function getMultipleValues() { return [10, 20, 30]; } // Destructure the returned array const [a, b, c] = getMultipleValues(); nested arrays const nested = [1, [2, 3], 4]; // Destructure nested array const [a, [b, c], d] = nested; destructing object swapping or mutating data // Mutating variables let a = 111; let b = 999; const obj = { a: 23, b: 7, c: 14 }; js Data Structures, Modern Operators and Strings 2  ({ a, b } = obj); //the () is nessesary unless it doesnt work console.log(a, b); const serie={ name:'merlin', type:'bromance', ship:['merlin','arthur'], year: [2008,2012], seasons:{ 1:{ episode:13, realesed:{First:'20 September 2008 ' ,Last:'13 December 2008'} }, 2:{ episode:13, realesed:{First:'19 September 2009 ' ,Last:'19 December 2009'} }, 3:{ episode:13, realesed:{First:'11 September 2010 ' ,Last:'4 December 2010'} }, 4:{ episode:13, realesed:{First:'1 October 2011 ' ,Last:'24 December 2011'} }, 5:{ episode:13, realesed:{First:'6 October 2012 ' ,Last:'24 December 2012 '} }, }, }; const getInfo =function({name:serieName='the best serie i know',type,ship:[fistS console.log(`it is ${serieName}.it has a ${type} story.the main copel are ${fist js Data Structures, Modern Operators and Strings 3  } getInfo(serie); spread operator: for passing separated data of array into the function 🍕(short answer!): const orders = ['salad','kebab','cola']; const restaurantOrder= function (a,b,c){ console.log(`here are your ${a} and ${b} with ${c} `); } restaurantOrder(...orders); const otherOrder = ['donat','pizza','abali']; const copyOfOtherOrder =[...otherOrder]; console.log(copyOfOtherOrder); const allorders= [...otherOrder ,...orders]; console.log(allorders); console.log(...allorders); const [ ,myFood, , , yourFood] = allorders; console.log(myFood,yourFood); const restaurant={ foundIn:'1998', founder:'poo', foods:[...copyOfOtherOrder], }; const copyRestaurant= {...restaurant}; copyRestaurant.founder='Fatherpoo'; console.log(restaurant); console.log(copyRestaurant); js Data Structures, Modern Operators and Strings 4  const name='harry'; const family= 'potter'; const letters =[...name, ,...family]; console.log(letters); for shallow copy of objects : iterables :arrays ,strings ,maps, sets.but not objects the…is work on all iterables. also work on object(despite that the objects are not iterables) only when functionName(…str) or build a new array const newArr=[…str,…sld]; the differents between rest pattern and the spread operation : spread:unpack the array rest:pack into array rest pattern and parameters : must be the last element const HP =['harry','hermion','ron',...['dambeldor','Snape','mackgolagan']]; console.log(HP); const [name,...rest] = HP; console.log(name,rest); const serie={ name:'merlin', type:'bromance', ship:['merlin','arthur'], year: [2008,2012], seasons:{ js Data Structures, Modern Operators and Strings 5  1:{ episode:13, realesed:{First:'20 September 2008 ' ,Last:'13 December 2008'} }, 2:{ episode:13, realesed:{First:'19 September 2009 ' ,Last:'19 December 2009'} }, 3:{ episode:13, realesed:{First:'11 September 2010 ' ,Last:'4 December 2010'} }, 4:{ episode:13, realesed:{First:'1 October 2011 ' ,Last:'24 December 2011'} }, 5:{ episode:13, realesed:{First:'6 October 2012 ' ,Last:'24 December 2012 '} }, }, }; const {name,type ,...rest}= serie; console.log(name,type,rest); rest parameter for the function: const shopingList = function(...concepts){ console.log(concepts); } shopingList('eggs','tomato','butter'); shopingList('noodels','chilly','sussages','parmejan','cola','ice'); js Data Structures, Modern Operators and Strings 6  const x=['gasming tea','poison '] shopingList(...x); operators : use any data type , return any data, short circuiting //return first truthy value console.log(2||'loise') //2 console.log('loise'||2) //loise console.log(0 || null||'hana') //hana console.log(0 || null);//null //return first falsy value console.log(0||'sherlock'); //0 console.log('loise'&& 2&&'hana')//hana we can change the if else statements to the statements with AND OR Nullish coalescing operator: //return first nullish value:null , undefined(NOT 0 '') const aurthorLovetoMerline =0; const loveNum = aurthorLovetoMerline ?? 100; console.log(loveNum); //0 logical assignment operators: const character1={ name:'Gandalf', // age:55000, job:'wizard', js Data Structures, Modern Operators and Strings 7  }; const character2={ name:'Frodo', age:33, // job:'ring keeper', }; //if the age : 0 it dont work character1.age||=55000; character2.age||=55000; console.log(character1.age); console.log(character2.age); character1.age??=55000; character2.age??=55000; console.log(character1.age); console.log(character2.age); for of loop continue and break ✅ index ❌ const arr= ['Newt','Tina','Jacob Kowalski','Queenie'] for(const item of arr) {console.log(item)} if we want the index?? for(const item of arr.entries()) {console.log(item)} //[0, 'Newt']] //(2) [1, 'Tina'] 0: 1,1: "Tina"length: 2[[Prototype]]: Array(0) js Data Structures, Modern Operators and Strings 8  //[2, 'Jacob Kowalski'] //[3, 'Queenie'] for(const [i,el] of arr.entries()) {console.log(`index ${i} has the value ${el}`)}; enhanced object literals const seasonNum =[1,2,3,4,5]; const seasons={ //compute property names [seasonNum]:{ episode:13, realesed:{First:'20 September 2008 ' ,Last:'13 December 2008'} }, [seasonNum]:{ episode:13, realesed:{First:'19 September 2009 ' ,Last:'19 December 2009'} }, [`the day${5-2}`]:{ episode:13, realesed:{First:'11 September 2010 ' ,Last:'4 December 2010'} }, 4:{ episode:13, realesed:{First:'1 October 2011 ' ,Last:'24 December 2011'} }, 5:{ episode:13, realesed:{First:'6 October 2012 ' ,Last:'24 December 2012 '} }, }; const serie={ js Data Structures, Modern Operators and Strings 9  name:'merlin', type:'bromance', ship:['merlin','arthur'], year: [2008,2012], //old way:seasons:seasons, //ES6 seasons, //ES6 getInfo(){ console.log(`it is ${this.name}.it has a ${this.type} story.the main copel are ${ } }; serie.getInfo(); optional chaining: const seasonNum =[1,2,3,4,5]; const seasons={ //compute property names [seasonNum]:{ episode:13, realesed:{First:'20 September 2008 ' ,Last:'13 December 2008'} }, [seasonNum]:{ episode:13, realesed:{First:'19 September 2009 ' ,Last:'19 December 2009'} }, [`the day${5-2}`]:{ episode:13, realesed:{First:'11 September 2010 ' ,Last:'4 December 2010'} }, 4:{ episode:13, realesed:{First:'1 October 2011 ' ,Last:'24 December 2011'} js Data Structures, Modern Operators and Strings 10  }, 5:{ episode:13, realesed:{First:'6 October 2012 ' ,Last:'24 December 2012 '} }, }; const serie={ name:'merlin', type:'bromance', ship:['merlin','arthur'], year: [2008,2012], //old way:seasons:seasons, //ES6 seasons, //ES6 getInfo(){ console.log(`it is ${this.name}.it has a ${this.type} story.the main copel are ${ } }; //dont want to get error? //chaining(if they are not null or undefind) console.log(serie.seasons['6']?.realesed.First); serie.getInfo?.(); serie.risoto?.(10,12)??console.log('the method does not exist'); //array const movies =[{director:'xavier dolan',age:22},{top1:'I Killed My Mother',top2:'m console.log(movies.tope??'there is no top1 movie'); looping objects ,object keys ,values ,entries: js Data Structures, Modern Operators and Strings 11  looping over property names: const yourBuletJornal ={texture:{size:10,colore:'lightGreen'},margins:{size:'25cm for(const k of Object.keys(yourBuletJornal)){ console.log(k) } //texture //margins //Binding const keyArr = Object.keys(yourBuletJornal);//keyArr:['','',''] const valuesArr = Object.values(yourBuletJornal);//valuesArr:[{},{},{}] const keyValues = Object.entries(yourBuletJornal);//keyValues:[{key,{value}},{ke an example: const openinghours = { sat:{ open:'10 am', close:'10 pm' }, sun:{open:'11 am', close:'9 pm'}, mon:{open:'6 am', close:'12 pm',shift:'harry'} }; // for(const day in Object.keys(openinghours)){ // console.log(day); // } const days = Object.keys(openinghours); console.log(days); js Data Structures, Modern Operators and Strings 12  const values =Object.values(Object.keys(Object.values(openinghours))) ; console.log(values); const enteries = Object.entries(openinghours); //day[key values] for(const [day,{open,close}] of enteries){ console.log(day,open,close); } js Data Structures, Modern Operators and Strings 13