Refactoring your code is part of normal code maintenance.
Visual Studio Code makes it easy for you to continuously refactor
and improve your code by taking advantage of the capabilities
included in different language services.
The particular refactoring supported will vary based on your
programming language and the extension you install.
I'm going to demonstrate a few of the possible options
using JavaScript.
Inside this file, I've developed a very basic
implementation for the ShowDiscountOffer function.
It declares a variable to store a discount,
it then retrieves the vacation cost from an element on the web
page and multiplies it by the discount.
The resulting value is then shown in an element on the page.
Let's refactor this code just a bit using some of the features
available in VS Code.
I'll first select the line that declares a new variable
for the discount.
Let's imagine I want to use this value elsewhere in this file.
With the code selected, a little light bulb appears
just to the left of it, letting me know there are code
actions I can perform on this code.
I'll click on the "Light bulb" to view them.
The pop up menu shows me several possible refactorings. Because I
want to use this value elsewhere in the file,
I'm going to select "Extract to constant in global scope."
I'm immediately prompted for a name for the new constant.
I'll name it discountPercentage.
You can see the new constant declaration is added just
above the function, and the code inside the function
assigns the value of the constant to my variable.
You can also extract bits of code into their own function.
I want to move the calculation that multiplies cost times the
current discount into a separate function.
After selecting the calculation, I'll again click the code action
light bulb on the left.
This time I'll select "Extract to function in global scope."
I'm prompted for a function name, I'll call it calculateDiscount.
You can see the new function was created below in my previous
calculation has been replaced by a call to the new function.
Probably, the most common type of refactoring is to change the name
of a symbol in your code.
This could be a variable name, class name, function name,
anything like that.
VS Code makes updating names very easy.
I'll rename the discount variable inside my function.
I just select it and press "F2" on my keyboard.
That presents me with a box where I can type the new name
I want to use.
Notice that I'm using this variable at the end of the line
of code just below this one.
I'll change the name to customerDiscount.
As soon as I press "Enter," the name of the variable and all
references to it are updated with the new name.
Support for code refactoring is one small way
VS Code encourages you to write apps that are easy to
maintain over time.
You should definitely investigate and take advantage of the specific
refactoring supported in the languages you use.
The other developers on your team and maybe even you in the future
will appreciate that you did.