Phil Choi shows three JavaScript utilities for working with messy data objects from APIs and social logins: a recursive key checker, a dot-notation property retriever, and a sort function that handles nested fields and dates.
Chapters
There's a story behind this piece of code I created. Before I share you with this code, I wanted to tell you the story. It takes a problem that is hard to solve to make a programmer think, how can we do this better? How can we find a solution to this problem? In this video, I will share with you this piece of code that I wrote that is useful for all developers working with large pieces of data or objects. My name is Phil. I became a senior developer after the age of 30. If this video becomes of use to you, please share and comment on a function or piece of code that you made that helped you or allowed you to solve a unique problem. Solving. So I wrote this piece of code a while ago. We're working with a lot of social logins. So like in Korea there's like Naver and Kakao and like even like Google and Apple login. Sometimes I get updated and the shape of the object changes and I'll be checking for like an email or something within the code. So I need to know if a key is inside of an object to kind of use it. Let me see if I can find some code. I was using it and I remember maybe it's over here. I think it's inside of app navigation or something. I. I haven't opened this code in a while. So if there's a token result, I. When they logged in, I kind of made a custom token inside of the server so they could log in with the custom token. And that was set off by my like, I don't know, some social login function. And then I had to check if the email was in there because all social logins kind of give you back a big payload with an email. So I wanted to see if the email was there. And like I think we had a breaking change in production because I was like looking for an email within claims where I was like tokenresult claims email or like user email or something. And I thought it would always be there but that wasn't the case all the time. So I was, I had to write a function that was going to go in and check the object and see if the email exists. So I'll show you that function. Now here it is, it's check if key exists in object and give back value if exists and false if not. This is the function you could put in an object and a key to check for in the object and then it'll return the value of the key or it would, it would get back false if it didn't exist. So at first so it's called key exists. You can pass in any object and it just passes if it cannot find the key. So obviously if it's not an object, it cannot find the key anyways if it, if it's gotten this far and then if it's an array or whatever. So return false. So else, if, if key is an object, just give back that value. Else if it's an array, try to go, go in into the array and look for it and return the result and use recursion and then else we go through the object and try to find it. So that was the function and it was pretty good. I liked it and it worked. It helped me with my code. A and to like kind of use it Here, I'll turn this off right here to use it. Maybe you just go like here's like an object and then here's like, I don't know, person's name. We'll have first Phil, last Choi. And then we can have kind of like contact info and then that could be email, leadfield.contact gmail.com maybe phone. I don't know my phone number actually. Here you go. And maybe those are it. Okay, that's enough. So here's an object and then I would want to check if email exists in there, right? So I could do, I could do console.log key exists email and that would equal key exists. So now. Oh no, no. So I have to pass the object first, then the key, this object. So if I run this code, I say no key exists JS I run the code, it would give me back let fail.contact gmail.com because it goes in and finds the key email. And if I try to something like name it would give me the object first and last. Right, look first, last, right there. And then if I try to get like middle name middle it would get back false. So I thought the function was quite useful for like if you're hitting APIs, you don't really know like for sure what the response is all the time and you need some kind of value in there like email or like id. I'm sure ID will always be in a payload or email will always really be in a payload. So those are kind of safe to kind of search for. So yeah, I use this function a lot. You can take it with you and maybe it'll help you in your career or whatever. I'll add this into the repository, hopefully it'll be of use to you. I have some other functions. So here I have one function called get property value from the description is get property by dot notation. So get property value from the object by dot notation. And this one got tied into one more. So I'll show you two here. So you take the. It takes the property name and dot notation. It takes the object and then returns the value. So let's make an object. Oh, so it just splits it by the dots and then four and then it keeps getting the property and then it says so like, let's go like a very nested B. And that's going to be C and that's going to be D and then E. Let's go like this. So then if I said like this, right? Console.log get property by dot notation. And then I pass in, let's say a.b.c.d. i should get back E. So get property by dot notation A, B, c, D and I should get back E, right? Node get property by dot notation. JS get properties of undefined reading A Oh, I never passed the object. Sorry. So here we go. Pass the object here too. So now we get back E, right? If I say give me a.b.c, it should give me the object D, E. Right. So let's go take a look. And that was pretty useful to kind of look for a property within an object, like quickly without having to break it or whatever. So that was good. And then I'll pair it with something that I used it with. So I kind of paired it with this function called sort array of objects. So so key has to be a number or a date and time. Okay. So description sort array of objects by key. I know there are other libraries like Lodash that do this and stuff, but this was just my implementation. So param array array of objects. Then the key and it can be in dot notation because we are using the dot notation from before. And then it can be ordered by ascending or descending and return the array. So the sorted arrays. So Basically everyone in JavaScript knows like this sort. And then you pass an A and b and then A minus B will give you like the ascending or B minus A will give you the descending or whatever. Hopefully I got that right. And then if it's not dot notation, you can just do it like this one that works here. I kind of wrote some function out here. Here we are. So we have const array and then we have an array of objects, name or name and then skills. So if we wanted to sort them by maybe JavaScript we could just pass in sort array of objects and then we pass in the array of objects and then skills.java and then we can pass in descending desc and then we can run it node what is this called? Sort array of objects JS Sort array of objects and then it sorts it the 10, 7 and 6 and then if we. If we sorted it the other way. So 6, 7 and 10. So those are kind of functions that I really liked at my old company. Key exists and get property by dot notation. Sort array of objects I have. I will push all this code into that utilities repository and you guys can pull them and check them out yourself. When and if you guys find use in it, let me know about it. Hopefully it's good for you too. As it was for me. Small change. The key exists. Description push, commit and clean up. All right, so these were really useful for me. Just remember, don't give up. You will eventually find the solution to the problems you're having. If you need help or want to join a society of programmers who really want to level up together, please join my discord in the description below. Remember, if I can do it, you can do it too. Coding saves lives.
