Code Transformation and Linting with ASTs

Challenge 9: Solution

Kent C. Dodds

Kent C. Dodds

Professional Trainer
Code Transformation and Linting with ASTs

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

The "Challenge 9: 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 9.

Preview
Close

Transcript from the "Challenge 9: Solution" Lesson

[00:00:00]
>> Kent C Dodds: I realize that the actual solution that loaded into all of your stuff was a little bit different in implementation. I added this looks like instead of trying to determine whether it's a variable declarator. Yeah, so, or sorry, I added it looks like on the parent function to see if it had an identifier for the function declaration, and if there's a variable declared then I'll give the name.

[00:00:27]
So multiple ways to do the same thing in JavaScript, who knew. Let's go ahead and support this pattern, function expressions. So should be pretty straight forward after our last experience. So we're just gonna add another or here. Or is regular function expression and,
>> Kent C Dodds: Let's see.
>> Kent C Dodds: Yeah, okay.

[00:00:59]
And then we say, if it's a variable declared, let's see, hold on, sorry. Yeah, okay, that makes sense, yeah. So if what we're providing is a variable declarator or t.isFunctionExpression(parentFunction.parent). And actually we should probably look at the AST really quick before I just type stuff. And so what we're looking at, this is the parent function.

[00:01:33]
It is this function expression is the parent function. So then we want to look at the parent and if that, let's see.
>> Kent C Dodds: I've just confused myself. My solution that I have shouldn't actually work, but it does. So now I'm confused as to why it works. Well it just happens to work because it's a function expression but we don't actually verify that it's a declarator.

[00:02:08]
I'm pretty sure we don't even need this. Yeah, we don't need that. [LAUGH] That was easier than I thought. That was kinda weird. Yeah, so my solution was wrong. If anybody wants to make a poll request to remove that from my solution, you're welcome to do so. So yeah, to recap because I was all confusing, all that we needed to do is just add this or case for isFunctionExpression.

[00:02:32]
And then, yeah, then everything else works. If it's a variable declarator, if the parent is a variable declarator, then use that parent's ID. And let's just put that in here, make sure our tests are passing, and they are. Anybody learn anything interesting out of that one, hopefully? Yes, something.

[00:02:55]
>> Student: Just look at the prototype. When in doubt, I was trying to, I was stuck and then I just happened to glance at the prototype and see, right, this is a lot more obvious then I imagined.
>> Kent C Dodds: Yeah, yeah. Just to be clear for folks at home or anybody who's not certain what you're talking about, you're kind of talking about taking the path, logging that, and then looking at the proto object here and just reading through that.

[00:03:27]
>> Student: Yeah, I mean just finding the method I needed or the function I needed.
>> Kent C Dodds: Yeah, it's pretty handy stuff. And you could do some JavaScipt magic to have a filter or something for, it has these words or something like that. Yeah, and another one to look at would be path.scope.

[00:03:48]
This one has a lot of things on it as well that are really useful. Great, so that is our Babel plug-in. Captains log. Cool stuff, love the reference to Star Trek.

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