Copy Digisign Dropdown with airSlate SignNow

Copy digisign dropdown

hi guys welcome back to another video so in this video I'm gonna show you how to loop through JSON file it's basically the same things as array and this is just like creating a new file and in Jason so I'm going to explain you what Jason file is and how we can actually use it okay so here as you can see this is the official website of the JSON file there's just JSON documents or the website so it's then for JavaScript object notation it's a lightweight data interchange format and it easily for Inhumans to read and also write and this file is looking something like this so there's many languages that can also use JSON file in different format here as you can see so next one here is the format of the JSON file itself you can check the benefit and how to use it I'm going to show you like how to use it as well but in a very basic example so it looks something like having this is the book and what is inside the book so here the book itself has the ID the language Edition and author of the book and this is just one book and this is like the other example of the book as well so this is the second book with ID or say some 7 or C the language Edition and the author ok so what are we going to do with our react app here so now let go to the this is the file that we are recreated from the last video how we can actually loop through an array so we got like country here and I would say that the array the format of the array is looking similar to the JSON file I would say 95% or so how are we going to create like a JSON file okay so now let's get started I'm going to create a new new file so because we are recreate like a country array so I'm going to do the same so country dot Jason and he is a new file what I'm doing here is that I just copy everything here from the array format into this JSON format but you can already see that there's an arrow with the red color here so how are we going to do we just need to type double quote inside this like ID also country and this is how we create or write with JSON format or the syntax of the JSON file so it's pretty much the same okay so now let me save the file alright so this is already we got the JSON file already so now let's get back to the chasing j/s and now I'm going to call this far so how would I do it I'm going to plus just call it us country inside a wearable and then I'm going to call this file how would I do it I just write require and slash country dog Jason I need to also put it inside the double quote as well so so here it is it's quite simple because I'm here I put it inside the same as this inside the source folder so what I need to do I just put a Qui and dot forward slash the name of the JSON file and that basically it's now inside this JSON variable how can we actually use it okay so we can just basically delete the be stored state our country so if we remember this country is coming from the dish dot select a state so I want to use this how I going to do I just need to delete this dot state so right now we are calling the country's coming from the JSON file is that okay now let's go back to the app and we can already see that the file is already loaded it is that simple so next I'm going to use the format which is similar to this so it called like the books here it has different so in this case they have two books inside this book so I'm going to do the same as well because we are talking about the country so what I'm going to do I'm going to do like a name for this us say wall so inside wall we have different countries and I'm going to save this so it end up in this format which is the same as the one I show you on the website so let's go back to the react app first so we can see that this countries dot map is not a function so we got an error the reason is that because we just create like a world right there if you can see so how are we going to do it we just put the countries dot world dot map and then that basically it now when we go back we can see that we can look through all of this again so I'm going to also create a new one a new country otherwise we might get confused with the previous one with the previous one with the arrow as well so I'm going to create like a new country say China in this case I'm going to save it and right now when we go back we can see that we look through all of this so this time we'll oops and chase and file not an array anymore so I'm gonna change the name from here as well so looping through j-jason file so now we go back you can see that it's clearer and also I'm going to in this case just copy and paste otherwise we're going to get a little bit confused or maybe some user may find that we can't just use the previous one with the current one which is this is the is the previous one loops through array okay so now let's go back and see the result we get an error because of the property map it's because we use country dot map is coming from this wearable so now when we go back we can only see that these looping is through an array this is looking through JSON file or we can also say render from the JSON file so here is the result from that okay so we have already achieved the first goal that we talked in the video and next one this video has not finished yet we are going to remove the duplicate value coming from this Sage's and file on ray in this case I'm going to use JSON file so what I'm going to do I'm going to create the country with the same name so I would do I just change five six I'm going to create two more seven eight don't forget to put a comma here and I'm going to copy the country with the name of Cambodia so we got Cambodia and also Australia in this case okay so we have a duplicate value which is Cambodia to Cambodia Australia US and China okay so I'll recreate the duplicate value and how are we going to do pick remove the duplicate value coming from this JSON file or either coming from the array so now let's see what we are going to do with this alright guys welcome back and right now I'm going to show you how to actually remove the duplicate value coming from the JSON file here so in this case I have already created like a loop of this as you can see that this is the country name say in Cambodia we got to Cambodia Australia too as well and us just one that's fine and the other one here is China we have three China's so how can we actually remove this when we loop through the JSON file in this case so here I have four website opens and right now we can have a look at this way so here you can see that is the three ways to remove an array dublicate so first one we can actually use set or filter or sorry reduce as well so now we can see this is the example of using the sad this is the filter and reduce so when we scroll down we see that this is the using set and [Music] this is the array is just simple array not as we are using which is currently we are using the format as and objects so here this is just a normal array without the ID or the countries and here's the step to do by using this app so you just use keyword like new set array and put into a wearable finally just use the fireable and convert it back Norma Rae so here's the result that we can see that means the vertical icon with three icon here so it ended up coming here the result in just one and here we can also convert a set to an array using the array from so it is the array and we set and coming from this just like a shortcut way to actually get the result the same as this and second method is using the filter so you can see that we use here is the index so just filter coming here is the same array using the filter also having the item so each interview item here and is the index of this so starting from 0 1 2 3 4 5 extra and is the result just put it into the consultant log and return the array dot index of this equal the index so if it's the same then it will move in this case you can only see here in the table and because we already got this so the result is fold retrieve the duplicate value so again we can just write in this way or the other one is the reduce method is to use me to use the element of an array and here is the other way to use the reduce the unique and this is the item so he included item if it unique otherwise just use this alright so we can already see that there are many ways to actually get the array duplicate just use which is what we are going to do is just to get the unique value coming from that so here we can actually see some of the response coming from here as well so some Entenmann's is one of the block writer sees also experience all these coding stuff and you can follow her her tutorial are quite similar easy to understand so I would recommend you guys to do that as well so he is he said she wrote a simple test and the result different depending on the browser that you use on Chrome with the array dot from actually the slowest and seemed like the set which spread is a lot faster so this thing that the browser eventually prioritized the optimized certain method to be more efficient as it become more popular so what happened when we click on this see if there is like a result test or something okay so we can see that it might not be working at the moment perhaps sorry deleted or something here so there's no title no author okay so that's fine let move to the next one here is the same article as well so this is post on death door too which is kind of similar things that we just look at them a second ago so next one here is the way to remove duplicate objects coming from an array so again this is similar to the previous one we look at but this one here is the way to actually remove the duplicate objects coming from an array or JSON file but not coming from a normal array because right now you can only see that we are using the country that jason here so here this is the format within the objects or we can say that the key value pair but this one here is just a normal one we can see the differences here so what we are going to use here is actually coming from this article so you can see that this is the objects with the ID also the name and here is the function that we're going to actually use this so how are we going to do it okay now when you click on this edit our core pain is going to open this you can see here so what I'm going to do I'm going to just copy this so before copying this we have a quick look at this so they create like a function with the parameter of array and this is the comparison and create a value with this and loop through each comparisons and store the key from the unique objects only the unique one which is the not be duplicate one and eliminate the dead key and sordid unique objects and it returned this unique so all right so now let's copy this and put it into our application so I'm going to put it on top of the render method copy and paste so you can see that there's an arrow here so what we're going to do just delete this keyword just put it on top here so it going to store the comparison value in an array right so how are we going to use it I'm going to declare a variable can't say unique country in this case and I'm going to call this function and then I'm going to call which is this value coming from the JSON file country dot world if you remember that we create like a world here if we doubt this world we can just call it rightly say country and going to comma with the what are we going to get the unique value from the country so we can just say it's country here there but remember that there's one thing we need to put which is the keyword dot the reason is that we call this function outside of the render method so this is the reason we're going to include this dot get while you just asked this so now we get the unique country how are we going to do it we're going to copy that and paste it into right here but without the world because we already declared up there so here unique country now let go back to the browser and see what the result is so here all right um probably I put it in the wrong one alright so after the page refresh we can only see the result here which is only Cambodia Australia u.s. or China so I'm going to put more country probably u.s. so just when you to see if it's actually working so I'm going to put two more right here with the ID are nine ten and this can be us or probably New Zealand right here so say and don't forget to put a comma here okay alright so now let's see the result so here you can see that I create another one bit is the duplicate country which us right now we can only see just one u.s. and here is in New Zealand so yep so that's how we actually get the unique value coming from in this case the JSON file and it worked the same as for the country right here if you want to actually implement the function right here so this video we have covered how to actually load or render the chase and fire coming from that and this the other one which is how can we actually remove the duplicate objects from the array are coming from the cheese and fire I think that's basically it for this tutorial so for the next tutorial we are going to look into something new that I haven't actually mentioned to you guys and let's see the next video what we are going to cover see you guys in the new video [Music]