Top 5 techniques in TypeScript to bring your code to the next level

Write better code with refactoring and functional approaches

With time and practice, we all deliver code with better quality. However, there is always room for improvement. Whenever I look at the code that I wrote half of the year ago, and I don’t know how to improve it, I think about two things. Either I didn’t grow, or it is already in good shape. If you’re like me, and the code quality is essential to you, then that makes two of us. Most likely, this article will discover at least a few new techniques you didn’t know and might use on a regular basis.

Topics to cover:

• Better validations with includes and selector function
• Use callbacks to encapsulate code that changes
• Consider using predicate combinators
• Even better predicate combinators with factories
• Encapsulate algorithm in the new class

Better validations with `includes` and selector function

Problem:

We have a function that compares the same object property with multiple values of the same type and returns true in case if at least one statement is positive.

Solution:

We can use an array method includes. With this approach, an if statement will look cleaner than before.

But there is a catch.

First, we have hard-coded data inside the function, or to put it in another way we have an implicit input (EDIT_ROLES).

Second, what if we want to make another role guard function that will be checking different action roles?

We can provide a factory function that will take a selector function and data responsible for describing a user role. The function itself returns another function that takes a user and compares his status with the previously passed role list.

In this way, we’ve split the data from the function, what is good from the functional standpoint, and made it reusable.

Here is an example of how easy we can add another role guard function:

But wait a minute. You probably think about the selector function. Why do we need it?

With the help of the selector function, it’s possible to select different fields.

Suppose a user has a team status role field, and we have to check whether he is a team lead or manager. It’s effortless to develop a guard function that follows mentioned requirements by using an already implemented function.

Use callbacks to encapsulate code that changes

Problem:

We have multiple functions that are pretty similar, with a minor difference. So it would be great to get rid of the duplicated code.

Solution:

We can extract the code that changes and pass it through the callback. In such a manner, we’ll remove duplicate code.

Consider using predicate combinators

Problem:

Our predicate functions are checking too much and are in charge of more than should.

Solution:

We have to start using the predicate combinators. It will increase code readability and reusability.

Let’s take a look at the combinator predicates in action:

Even better predicate combinators with factories

Problem:

Predicate combinators create too many variables, so it’s easy to get lost between these functions. If we use the combinator predicate function only once, then it’s better to have something more generic.

Solution:

We have to start using the combinator predicate factories. Let’s add a few:

You’ve probably noticed that some function invocation is repeated with the same arguments. The best option will be to mix predicate factories with combinator predicates together. Thus we’ll have the best of both worlds.

In this way, we do fewer repeats and keep the code clean and neat.

Encapsulate algorithm in the new class

Problem:

We have a class responsible for too many things. It’s bound with algorithm logic, but it shouldn’t.

Solution:

It’s fair to say this method shouldn’t reside in the user data model. Therefore, our mission is to split the responsibility. We have to extract the algorithm and encapsulate it in the new class to do this.

Further reading

If you liked the article, you might find these articles interesting as well:

TypeScript: Understand Built-In/Utility Types

TypeScript: Use polymorphism in place of the switch and other conditionals.

Conclusion

I hope you found this article interesting and came across new techniques. Please feel free to reach out if you have any questions.

Hit the clap button and subscribe, which will motivate me to write more articles.