Check out a free preview of the full Interviewing for Front-End Engineers course
The "Built-in Methods" Lesson is part of the full, Interviewing for Front-End Engineers course featured in this preview video. Here's what you'd learn in this lesson:
Jem covers ways to convert objects into arrays, and commonly used methods to work with arrays and what their expected outputs look like.
Transcript from the "Built-in Methods" Lesson
[00:00:00]
>> Lets talk about arrays. And I'm not talking about the thing you want at your compensation review of the year possible after nothing tough crowd. Maybe is a hard question. Arrays the data structure. There are many ways to convert an item into array, so if I have an object I can call object.entries() that will give me an array of arrays.
[00:00:25]
Where the first object in the array is or the first entry at index zero is the key, there was the value. Actually and this is should be something I use all the time. If you wanna just get the keys out, you say object.keys and use that to iterate over an object.
[00:00:39]
You can say array.from. It will take an array-like object. So function arguments are an array-like object. They're not an array but they look like one, and if you convert into an array, you can use array methods on it. What's another one? HTML elements or children, things like that, not necessarily arrays but you can manipulate one with array.from.
[00:01:02]
You could also use spread or whatever iterable that you want so strings are iterable, other arrays are iterable. This just spreads this odd amount into an array. So these are ways to get to an array. Useful methods that I find. There's a lot. I could actually do the entire list cuz they're all pretty useful.
[00:01:21]
Array .isArray is useful because if you've been doing JavaScript a while, finding out if something's an array was actually a hard problem. You couldn't actually do just type of array because array's not a type, array would come back just as objects. So array .isArray is extremely useful. Filter, reduce, concat, join, pop, push I won't go too much into these and assuming if you know, a little bit JavaScript you probably have seen these before.
[00:01:46]
But what's important to know about these is which of these methods return in your re which of them don't. So filter, just give me a yesterday returns a new array are now.
>> Yes.
>> Yes, it does reduce.
>> Yes.
>> Reduces the tricky one, reduce will return anything you want to return you want to return objects,it will return an object you want to turn an array, it will return an array.
[00:02:10]
It will return pretty much anything you want whatsoever. This is one of my favorite methods of all time. I can do almost anything you want to do in JavaScript with a reducer and that's why the famous map reduce, there's the map part at radial or something and then reducing it down to the object you want to get.
[00:02:25]
That's probably like 50% of programming that we do, if you're like being really honest. The other 50% is just reading something from a database. I'm totally serious. [LAUGH] Like think about what your job is and that's probably what it is. It's reducing something and reading something from a database.
[00:02:39]
Concat returns a new array or no? Yes, it does. It will join two arrays. It will join, it will actually if you concat a function and you can add a function onto an end of the array if you wanted to. Pop? No pop returns that first item from the array.
[00:02:56]
It just returns an item. It doesn't return the array. Push. It doesn't return anything. It's just a method. Map, it does return a new array. All right, so now you know these methods. You don't have to know them like the back of your hand. Weird, but I do recommend knowing at least some of these.
[00:03:18]
Cuz again, almost anything you wanna do you can do it with an array. As long as you know how to convert something into an array. You can start manipulating with these.
Learn Straight from the Experts Who Shape the Modern Web
- In-depth Courses
- Industry Leading Experts
- Learning Paths
- Live Interactive Workshops