Оператор typeof

JavaScriptMiddle~1 хв читання

`typeof` у JavaScript

Оператор typeof використовується під час виконання програми (runtime) і повертає рядок, що описує тип значення змінної.

Приклад:

javascript

console.log(typeof 42);         // "number"
console.log(typeof 'hello');    // "string"
console.log(typeof true);       // "boolean"
console.log(typeof undefined);  // "undefined"
console.log(typeof { a: 1 });   // "object"
console.log(typeof [1, 2, 3]);  // "object" (масиви - це об'єкти!)
console.log(typeof null);       // "object" (історична помилка мови)
console.log(typeof function(){}); // "function"

Повертає рядок, а не сам тип.

Особливості:

Ситуація	Результат	Коментар
`typeof x` (якщо `x` не оголошена)	`"undefined"`	Не видає помилки - безпечно!
`typeof null`	`"object"`	Історична помилка в JS
`typeof []`	`"object"`	Масиви технічно - об'єкти
`typeof function() {}`	`"function"`	Спеціальний підтип об'єкта

Приклад використання

javascript

if (typeof user === 'undefined') {
  console.log('user не визначений');
}

Тут typeof дозволяє перевірити наявність змінної без помилки, навіть якщо вона не оголошена.

`typeof` у TypeScript

А тепер головна відмінність:

У TypeScript typeof - це оператор, який працює з типами під час компіляції (compile-time), і він повертає тип, а не рядок.

Тобто він не обчислює значення, а бере тип змінної або виразу, щоб його можна було використати в анотаціях.

Приклад у TypeScript

javascript

const user = {
  name: 'Tim',
  age: 30
};

// беремо тип об'єкта user
type UserType = typeof user;

// еквівалентно:
type UserType = {
  name: string;
  age: number;
};

На відміну від JavaScript, typeof тут не виконує код, а просто отримує тип змінної, функції або класу.

Ще один приклад

javascript

function makeUser() {
  return { name: 'Alice', active: true };
}

type User = ReturnType<typeof makeUser>;
// User = { name: string; active: boolean }

Тут typeof makeUser дає тип функції, а ReturnType<...> - тип значення, яке вона повертає.

Ключові відмінності

Особливість	JavaScript `typeof`	TypeScript `typeof`
Коли працює	Під час виконання (runtime)	Під час компіляції (compile-time)
Що повертає	Рядок з типом (`"number"`, `"object"`, …)	Тип змінної/функції/об'єкта
Чи можна використовувати в умовах	Так	Ні (працює тільки в типах)
Приклад	`typeof x === 'string'`	`type T = typeof x`
Помилка, якщо `x` не оголошена	Немає помилки	Помилка компіляції

Приклад для контрасту

javascript

// JavaScript
let a = 10;
console.log(typeof a); // "number"

javascript

// TypeScript
let a = 10;
type AType = typeof a; // AType = number

Перший повертає рядок під час виконання, другий - створює тип на етапі компіляції.

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.