In TypeScript, developers often encounter two flexible types that seem similar: any and unknown. However, these types serve different purposes, and choosing the right one can have a big impact on the safety, readability, and maintainability of your code. Let’s dive into the key differences between any and unknown, when to use them, and how to safely apply methods to unknown types.

1. What is any?

any is TypeScript’s escape hatch. It allows you to bypass the type system entirely, meaning you can assign anything to a variable of type any, and TypeScript won’t enforce any type safety rules on it.

When you use any, you give up the benefits of TypeScript’s type checking, making your code more prone to errors. This is useful in situations where you genuinely don’t know or care about the type of a value, but it can also lead to hard-to-debug issues if misused.

let data: any;
data = 5;
data = "hello";
data = {}; // No errors

data.someMethod(); // No errors, even if this doesn't exist!

In this example, we see how any allows unrestricted assignment and usage, including methods that may not even exist. While this provides flexibility, it also removes the safety that TypeScript offers.

Real-life Use Case for any

You might use any when working with legacy JavaScript or libraries that aren’t fully typed yet. For instance, if you’re integrating an older JavaScript library into your TypeScript project, you might use any to quickly get around missing type definitions.

function handleLegacyData(input: any) {
  console.log(input.someLegacyProperty); // Might work or might crash
}

This allows you to continue working while gradually improving the type definitions over time.

2. What is unknown?

unknown is a safer alternative to any. Like any, you can assign any type to a variable of type unknown, but the key difference is that you must narrow the type before you can perform operations on it. This ensures that you check the value’s type before using it, making your code more robust and less prone to errors.

let data: unknown;
data = 5;
data = "hello";
data = {};

// TypeScript won't allow direct operations until the type is narrowed
if (typeof data === 'string') {
  console.log(data.toUpperCase()); // Safe, because we've checked it's a string
}

Here, unknown forces us to perform a type check before calling toUpperCase(). This makes it safer to work with values of unknown origin, ensuring the code doesn't break at runtime.

Real-life Use Case for unknown

unknown is particularly useful when dealing with untrusted or dynamic data, such as user inputs or API responses, where the type isn’t guaranteed. By using unknown, you can handle the data safely without making assumptions about its type.

async function fetchData() {
  let result: unknown = await fetch("https://api.example.com/data");

  if (typeof result === 'string') {
    console.log(result.toUpperCase()); // Safe, because we validated the type
  }
}

In this example, unknown allows us to handle data from an API that could return different types, enforcing a check to ensure the data type is correct before using it.

3. Using Array Methods on unknown

One of the key challenges when working with unknown is performing operations like array methods. Since unknown requires explicit type checking, you can’t apply array methods like map, filter, or push unless you first confirm the value is indeed an array.

let myData: unknown;
myData = [1, 2, 3];

// Check if myData is an array before using array methods
if (Array.isArray(myData)) {
  myData.map((item) => item * 2); // Safe, because we know it's an array
}

In this case, TypeScript ensures that you don’t accidentally call map() on a non-array type. This makes working with unknown far safer, as you’re required to validate the type before applying any operations.

Real-life Use Case: Handling API Data

Let’s say you’re working with a dynamic API that can return a variety of data types, including arrays, objects, or even primitive values. With unknown, you can safeguard your code by checking if the result is an array before using array methods.

async function processApiData() {
  let response: unknown = await fetch('https://api.example.com/items');

  if (Array.isArray(response)) {
    response.map(item => console.log(item)); // Only runs if response is an array
  }
}

This ensures that your code doesn’t break if the API returns something unexpected, such as an object or a string.

4. Key Differences Between any and unknown

• Flexibility vs. Safety:

  • any offers maximum flexibility but at the cost of type safety. You can assign anything to an any type and perform any operation without type checks.

  • unknown also allows you to assign anything, but it enforces type checks before performing operations, ensuring you handle values correctly.

• Type Checking:

  • any disables all type checking, making it difficult to catch errors.

  • unknown requires you to narrow the type before using it, making your code safer and reducing runtime bugs.

When to Use any vs. unknown

• Use any in scenarios where type safety isn’t critical, such as rapid prototyping, dealing with legacy JavaScript, or when working with untyped libraries.

• Use unknown when you need flexibility but also want to maintain type safety, especially when working with external data, user inputs, or any situation where you can’t guarantee the type upfront.

---

Conclusion

In TypeScript, the choice between any and unknown comes down to a balance of flexibility and safety. While any gives you the freedom to bypass the type system entirely, it can lead to unintended bugs. On the other hand, unknown provides similar flexibility but forces you to handle values in a type-safe way, ensuring your code is both robust and error-free.

Whenever possible, prefer unknown over any for handling unknown data, as it provides an extra layer of safety without sacrificing flexibility. This will lead to more maintainable, reliable, and bug-resistant code, especially when working with complex or untrusted data sources.

By mastering the differences between these two types, you can write TypeScript code that is both flexible and safe!