unknown Type in TypeScript

The unknown type can store a value of any type, just like any.

let value: unknown = "Hello";

The important difference is that TypeScript does not automatically allow operations on an unknown value.

Use the unknown keyword after the colon.

let data: unknown;

The variable can later store values of different types.

An unknown variable can store a string.

let value: unknown = "Hello TypeScript";

The value is stored successfully, but its type must be checked before using string-specific methods.

An unknown variable can also store a number.

let value: unknown = 100;

TypeScript accepts the value because unknown can represent any type.

An unknown variable can contain different types of values at different times.

let value: unknown = "Hello";

value = 100;

value = true;

All these assignments are allowed.

The unknown type can store boolean values.

let status: unknown = true;

status = false;

Both values are valid.

An unknown variable can store an array.

let data: unknown = [10, 20, 30];

However, you should check the value before performing array-specific operations.

The unknown type can also contain an object.

let student: unknown = {
    name: "Amit",
    age: 21
};

Before accessing properties, the object should be checked.

TypeScript does not allow you to directly use string-specific methods on an unknown value.

let value: unknown = "Hello";

// TypeScript does not allow this directly:
// value.toUpperCase();

First, check whether the value is a string.

The typeof operator can be used to check the type of an unknown value.

let value: unknown = "Hello";

if (typeof value === "string") {
    console.log(value.toUpperCase());
}

Inside the if block, TypeScript knows that the value is a string.

Use typeof to check whether an unknown value is a number.

let value: unknown = 100;

if (typeof value === "number") {
    console.log(value + 50);
}

The operation is safe after the type check.

You can also check whether an unknown value is a boolean.

let value: unknown = true;

if (typeof value === "boolean") {
    console.log(value);
}

The typeof operator returns "object" for objects.

let value: unknown = {
    name: "Amit"
};

if (typeof value === "object" && value !== null) {
    console.log("This is an object");
}

The null check is useful because typeof null is also "object".

Checking an unknown value and reducing it to a more specific type is called type narrowing.

let value: unknown = "Hello";

if (typeof value === "string") {
    console.log(value.length);
}

After the check, TypeScript narrows the type to string.

A function parameter can be declared as unknown.

function show(value: unknown) {
    console.log(value);
}

show("Hello");
show(100);
show(true);

The function accepts values of different types.

You can safely work with an unknown parameter after checking its type.

function show(value: unknown) {

    if (typeof value === "string") {
        console.log(value.toUpperCase());
    }

}

When an array is stored as unknown, check whether the value is an array before using it.

let data: unknown = [10, 20, 30];

if (Array.isArray(data)) {
    console.log(data.length);
}

Array.isArray() helps identify arrays.

The unknown type is useful when receiving data from an API whose structure has not yet been verified.

let response: unknown;

response = {
    name: "Rahul",
    age: 22
};

The data should be checked before it is used.

Both types can hold values of different types.

let a: any = "Hello";
let b: unknown = "Hello";

The difference is that any allows operations without type checking, while unknown requires appropriate checks.

unknown helps prevent accidental operations on values whose types are not known.

let value: unknown = 100;

// TypeScript prevents unsafe operations
// until the type is checked.

This provides an additional layer of type safety.

Sometimes you know the actual type of an unknown value. You can use a type assertion.

let value: unknown = "Hello";

let message = value as string;

console.log(message.toUpperCase());

The as string syntax tells TypeScript how you intend to treat the value.

An unknown value can also be asserted as a number.

let value: unknown = 100;

let numberValue = value as number;

console.log(numberValue + 50);

The assertion tells TypeScript to treat the value as a number.

In React applications, unknown can be useful when data comes from an external source and its structure has not yet been verified.

const data: unknown = getData();

The data can be checked before displaying it in a component.

React Native applications can receive data from APIs, storage, navigation parameters, or other external sources.

const userData: unknown = getUserData();

Checking the value before using it helps make the application safer.

Suppose user information comes from an external source.

let user: unknown = {
    name: "Amit",
    age: 21
};

Before accessing properties, the value should be checked or narrowed to a known structure.

A common mistake is trying to use an unknown value directly without checking its type.

let value: unknown = "Hello";

// Not allowed directly:
// console.log(value.toUpperCase());

First perform a type check or use a valid type assertion.

External data can have an unexpected structure. Using unknown encourages you to validate the data before using it.

let data: unknown = receiveData();

if (typeof data === "string") {
    console.log(data);
}

If you already know the type of a value, use a specific type instead of unknown.

let name: string = "Rahul";
let age: number = 20;
let active: boolean = true;

Use unknown when the type is genuinely not known yet.

Here is a simple example where the value may be a string or a number.

let value: unknown = "Hello";

if (typeof value === "string") {
    console.log("String:", value);
}

if (typeof value === "number") {
    console.log("Number:", value);
}

The program checks the value before using it.

The unknown type can store values of any type, but TypeScript requires you to check the value before performing most operations.

let value: unknown = "Hello";

if (typeof value === "string") {
    console.log(value.toUpperCase());
}

This makes unknown a safer alternative to any when the actual type is not known.