Code Transformation and Linting with ASTs

# Challenge 8: Solution

## Kent C. Dodds

Professional Trainer

### Check out a free preview of the full Code Transformation and Linting with ASTs course

The "Challenge 8: Solution" Lesson is part of the full, Code Transformation and Linting with ASTs course featured in this preview video. Here's what you'd learn in this lesson:

Kent walks through the solution to Challenge 8.

Preview
Close

### Transcript from the "Challenge 8: Solution" Lesson

[00:00:00]
>> Kent C. Dodds: All righty, let's do this thing. So, captain's log is getting cooler and cooler all the time, supporting more use cases, and now we need to support arrow functions. And, so we can't just do is function declaration or a arrow function with this nice type of API. We are gonna have to make our own function, to find the parent that we're looking for.

[00:00:23]
And so, let's go ahead and I'm just going to copy all this, make sure that we're on the same page here. And I'm going to make a new function that will get us the parent function's name. So that's what it will be responsible for. And it can just be at the root of our module.

[00:00:40]
So let's say function get, let's see what I call it, functionName. And we'll take a path. Doesn't matter what path, it can be any old path. And we're going to get the parentFunction called path.findParent. And here, we're gonna get a parent and we're going to determine whether or not this parent is a function that we're interested in, so a return t., or actually we can do several things.

[00:01:16]
We could either say t., is function or we can actually call directly on the parent. Say isFunctionDeclaration, and I'm just gonna leave it at that. We're doing a pure refactor here first. And we can say if there's a parentFunction, then we will return the parentFunction.node.id.name. And otherwise we'll return null.

[00:01:47]
And so then from here, we're gonna pass in our path, and this no parentFunction, this is the parentFunctionName.
>> Kent C. Dodds: Okay, pure refactor, everything that was working before is still working. I forgot to pull in our new test case here so let's do that really quick.
>> Kent C. Dodds: And pop that in.

[00:02:15]
Okay, so multiply the console.log is getting that, but it doesn't have the name so let's add that functionality. So we're going to say or the parent is, let's find out what type this is.
>> Kent C. Dodds: ArrowFunctionExpression. So if it's an ArrowFunctionExpression or a function declaration, then that's the parent we're looking for.

[00:02:38]
The problem here is that, the ArrowFunctionExpression does not have an id. It's null. And that's just part of the nature of functionExpressions or of ArrowFunctionExpressions. But it does have a name that we can infer, and that's the variable assignment. So w could say, if the parentFunction is an ArrowFunctionExpression.

[00:03:13]
Then we can do that otherwise, well here, let's actually we'll put that statement inside of here, so we don't break stuff. So, if it's narrow functionExpression that we're going to get the name from the variable to. So we can say, and the parentFunction.parentPath.isVariableDeclarator.
>> Kent C. Dodds: Cannot read name of undefined.

[00:03:47]
We're gonna return, we'll just return nothing for right now. So what we're saying here is, if the parentFunction happens to be an ArrowFunctionExpression. Then let's see if the parent, or here, let's do this with the explorer here. So our do do do, our ArrowFunctionExpression's right here, okay, that is an ArrowFunctionExpression.

[00:04:14]
Now let's go to the parent, and see if that's a variable declarator. Because if it is, then it's going to have an ID that we can use. So that being the case, we're going to return the parenyFunction.parentpath or we could say parentpath.node so that we can get the identifier, or we can shortcut to that and just get parent and that will be the parent node.

[00:04:47]
And we want the ID.name. And that solves our problem. There is another problem here that I could work through if you want me to, where if this is an anonymous function, anonymous arrow function, then it's gonna run this line of code. And so maybe what I, actually, I'll just do that really quick.

[00:05:10]
So, we'll say else if. It is an arrowFunctionExpression, but it doesn't have a variable, at declarator as its parent, then we'll just return that thing. No no wait, we covered that case too.
>> Kent C. Dodds: Okay, let's go ahead and copy this over here. Save that. And our tests are passing, excellent.

[00:05:31]
Hopefully, you all did the evaluation feedback and. Great, so what questions do you have about that bit?
>> Speaker 2: Is there a function that identifies all function types? So you don't have to say, have a whole bunch of Braintree logic for anonymous functions or function expressions?
>> Kent C. Dodds: So just kind of like a generic, I'm looking for a function.

[00:05:55]
>> Speaker 2: Yeah.
>> Kent C. Dodds: Yeah, I don't know of anything that does that. You might be able to make something that's kind of generic, but I'm pretty sure there are only four or five of them, so you can make a helper to do that.

### Learn Straight from the Experts Who Shape the Modern Web

• In-depth Courses
• Industry Leading Experts
• Learning Paths
• Live Interactive Workshops
Get Unlimited Access Now