Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    Refactor Services and Quick Fixes with Typescript 2.5

    Akash GuthaAkash Gutha

    This lesson covers the Refactoring services and Quick fixes provided by Typescript 2.5



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    I made a simple function that takes in the radius and height and calculates the volume of the container by taking in the radius and the height. Now, if I set up this block of code and refactor it using extract function into function volume, we can see that it generates a new function inside the scope of the volume function.

    We will rename this function so that it reflects our context better. We can also this new refactoring services on conditional blocks. Let's elect this conditional block, and use the refactoring service extract function into module scope. This will extract the logic into our outermost block. Let's rename this.

    As you can see, it has correctly identified the parameters required and passed in into the function. You can also see that it is returning the correct logic with the correct type. TypeScript 2.5 also gives us services to quickly fix some common mistakes.

    Here, the developer has used JS doctype assertion to bind the type of X to any. We can quickly fix by using the quick fix provided by the TypeScript service. The same can also be done for the number.

    Here, we are trying to bind Z to the type of code.bad, but code is the interface, and bad is a property of the interface. We are trying to bind Z to the type of number, but this isn't the correct syntax. We can also quickly fix by using the quick fix, which will convert it into the exact TypeScript syntax.