Refactor Services and Quick Fixes with Typescript 2.5

[00:00] 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.

[00:19] 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.

[00:38] 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.

[00:55] 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.

[01:11] 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.