Demystifying For Loops In TypeScript: A Comprehensive Guide
Looping through an array is a common task in programming, and Typescript offers a variety of ways to accomplish this task. If you’re using React, you might be interested in this article on for loops in React. In this article, we’ll explore some of [...]
How To Clean Up Your TypeScript Code With Optional Chaining
Optional chaining is a powerful feature introduced in TypeScript 3.7. It lets you safely access properties and methods of an object without having to worry about the object being null or undefined. This can help prevent runtime errors and make code more concise and readable. The Problem One of the [...]
How To Delay a Function in TypeScript
When developing TypeScript applications, you may need to delay the execution of a function for a certain amount of time. Delaying function execution can be useful for a variety of reasons, such as waiting for an animation to complete or for an API request to finish. In this article, I’ll [...]
Mastering TypeScript’s Spread Operator for Cleaner, More Flexible Code
The spread operator in TypeScript is a powerful feature that allows you to easily expand the contents of an array or object. This can come in handy when you need to make a copy of an existing object or array, or when you want to [...]
Understand Access Modifiers and Properties in TypeScript
Introduction Access modifiers are a feature of object-oriented programming languages that determine the accessibility or visibility of class members (properties and methods). In TypeScript, there are four access modifiers: public, private, protected, and readonly. These modifiers can be applied to properties, methods, and constructors to control how they can be [...]
What are Abstract Classes in TypeScript?
Advanced Array Reduce Techniques in TypeScript
The reducer method is a very useful array method. It lets you process an array item by item, reducing this to one variable. By default, the return type of the reducer is a single item of whatever your array returns. You can change the return type by providing a different [...]
Reading and Writing Files With TypeScript
You can read and write files in TypeScript using the “fs” module, which is a Node module containing methods for file system operations. The module is very versatile and provides a lot of different ways of reading from and writing to files, so in this article, I’ll talk you through [...]
How To Divide an Array in TypeScript
Splitting an array into chunks might be a common problem you’ll run into in your TypeScript apps. In this article I’ll talk you through my approach, how that works, as well as the Lodash approach. Using Reduce One simple approach to this problem is to use [...]
How to Use Axios in Your TypeScript Apps
What is Function Overloading in TypeScript?
Function overloading is an OOP feature. It lets you define multiple functions with the same name, but different implementations. TypeScript has semi-support for function overloading; it allows you to to define multiple signatures for the same function, but only one implementation. This can still be useful, however, and in this [...]
Mastering TypeScript’s New “satisfies” Operator
TypeScript 4.9 beta is introducing a new operator, the “satisfies” operator. The short version is that this operator lets you ensure a variable matches a type, while keeping the most specific version of that type. You can check out the discussion on the feature [...]
Primitive Types in TypeScript
Splitting Strings by Character in TypeScript
There are a few scenarios you might want to be splitting strings in TypeScript, whether it’s splitting a paragraph by newline characters, splitting a list by commas, etc The .split() Function Let’s explore the .split() function using a file just containing some randomly generated [...]
Mastering Typing React Props with TypeScript
What is Type Casting in TypeScript?
Introduction As you might know, TypeScript gives us plenty of beautiful features that highly enhance the development experience, such as: Strong Static Typing supportSupport for major IDEsError highlighting at compile timeGreat integration with other tooling to provide hints Microsoft has continuously supported it back since 2012. Edge Scenario of Strong [...]
Introduction to TypeScript Modules
Keeping all code in one file is rarely a good practice, and we know this is especially true when working with React. However, if you have not yet worked with React, don’t worry, as the topic we’ll discuss about today is not directly [...]
The Major 11 Utility Types in TypeScript
TypeScript provides a lot of utilities to help us write better, more scalable, better-structured, and overall safer applications. One of these utilities comes under the form of Utility Types, which we’ll discuss in this article. The concept of Utility Types in TypeScript is tightly tied with that of Generics, so [...]
What Are Enums in TypeScript?
Introduction Sometimes rigid structure can allow us to build robust and solid foundations for modern applications, and TypeScript’s Enums will enable us to do precisely that. Since version 2.4 of TypeScript, we have been able to use Enums, a data type provided to us with configurability and “flexible rigidity” in mind. What are [...]
Type Aliases vs Interfaces in TypeScript
Introduction TypeScript gives us a handful of tools to ensure the best developer experience and application-level sustainability; two of these tools are Type Aliases and Interfaces. We’ve previously written articles on both of these ways of defining new named types; if you haven’t already checked those articles out, be sure [...]
Merging Arrays Without Duplicates in TypeScript
Merging arrays is a common task you’ll face in most programming languages, especially merging arrays while only adding unique values. In this article, I’ll talk you through a few approaches to this in TypeScript, as well as the unique TypeScript quirks you might face. If you’re trying to solve this [...]
String Interpolation in TypeScript
TypeScript string literal types are a great tool that let you define a type as a literal string value. They’re also really useful when combined with type unions, commonly used as a sort of alternative to enums, when you just want to deal with strings. Here’s a simple example of [...]
What Is Interface Declaration Merging in TypeScript?
If you aren’t already familiar with the concept of interfaces or what they are in TypeScript, be sure to check out this article first, as Interface Declaration Merging is linked directly to them. Otherwise, we shall proceed with the rest of the article. What [...]
What Are Mixins in TypeScript?
If you’ve worked with TypeScript extensively, you would know that we cannot inherit or extend from more than one class at a time. However, this inconvenience is something we can get around by using something called Mixins. So, what exactly are Mixins? Introduction to TypeScript’s Mixins As mentioned prior, Mixins [...]
What Are Interfaces in TypeScript?
Similar to Type Aliases, TypeScript’s Interfaces provide us a medium to avoid code duplication across our TypeScript codebases. If we were to look at the alternative way of defining types, we would find ourselves defining and redefining types inline each time we want to [...]
What Are Type Aliases in TypeScript?
We may find ourselves defining the same Type in different places, which is not ideal, considering all the bad things we often hear about code duplication, but what can we do? The answer to that is Type Aliases. TypeScript allows us to reuse certain types by defining them the same [...]
Implementing GroupBy in TypeScript
The groupBy function is generally used to group arrays together by a certain condition. You can easily go for a built-in solution, such as lodash’s groupBy function, or implement it yourself in TypeScript. Lodash _.groupBy Lodash is a library that contains a large selection of utility functions, [...]
Conditional Types in TypeScript
Conditional types in TypeScript help you to create types depending on another type, by checking if that type satisfies some condition. In their simplest form, they take the format of: MyType extends SomeType ? IfTrueType : IfFalseType; Here’s a simple example, checking if a type can be [...]
What is the unknown type in TypeScript?
Introduction Not so long ago, in version 3.0, TypeScript introduced a new `unknown` type to its toolkit, but what does this type do, and more specifically, when should we use it? This article will look at this “new” type to better understand its goal. We’ll also consistently compare it to [...]
What are Generics in TypeScript?
One of the most important things when writing scalable applications is ensuring that the components that make up those applications are scalable and, thus, reusable by themselves. When working with TypeScript, one of the utilities that ensure units of work are reusable and scalable is Generics. Introduction to TypeScript’s Generics [...]
What is the any type in TypeScript?
When working with TypeScript or migrating an already existing codebase over to TypeScript, it is crucial to know how to handle typing properly. One tricky typing scenario to get right is when we decide whether or not to use any for a particular scenario. In this article, we’ll discuss about [...]
How To Add TypeScript To React
Perfecting Mapped Types in TypeScript
Mapped Types in TypeScript let you transform one type to another, by transforming the keys from one type to another. TypeScript offers a lot of flexibility with this, allowing you to modify the name of types, perform string interpolation on keys and more. In [...]
Mastering the Builder Pattern in TypeScript
The builder pattern in TypeScript is used to give a more flexible solution to creating complex objects, by breaking the construction up into separate steps. An example of this is the Promise class, which you may be familiar [...]