Пошук уроків, статей та іншого контенту
Навчіться визначати тип значення за допомогою оператора typeof. Розберіть його результати та важливі особливості, зокрема відомий випадок typeof null.
typeoftypeof — це оператор JavaScript, який визначає тип значення та повертає його назву у вигляді рядка.
Синтаксис:
typeof valueТакож можна використовувати дужки:
typeof(value)Дужки необов’язкові, але іноді допомагають зробити вираз зрозумілішим.
const age = 25;
console.log(typeof age); // "number"Результат роботи typeof завжди є рядком.
typeofДля рядків оператор повертає "string":
const name = "Олена";
console.log(typeof name); // "string"
console.log(typeof "JavaScript"); // "string"Для цілих чисел, дробових чисел і спеціального значення NaN результатом буде "number":
console.log(typeof 42); // "number"
console.log(typeof 3.14); // "number"
console.log(typeof NaN); // "number"NaN означає, що результат математичної операції не є коректним числом, але з погляду JavaScript воно все одно належить до типу number.
Для true і false оператор повертає "boolean":
const isLoggedIn = true;
console.log(typeof isLoggedIn); // "boolean"
console.log(typeof false); // "boolean"undefinedЯкщо змінній присвоєно значення undefined, результатом буде "undefined":
let result;
console.log(result); // undefined
console.log(typeof result); // "undefined"Також typeof можна застосовувати до змінної, яка ще не оголошена:
console.log(typeof notDeclared); // "undefined"Це особливість typeof: у такому випадку він не створює помилку ReferenceError.
bigintДля цілих чисел довільного розміру використовується тип bigint:
const largeNumber = 12345678901234567890n;
console.log(typeof largeNumber); // "bigint"Літера n наприкінці числа вказує, що це значення типу bigint.
symbolДля значень типу Symbol результатом буде "symbol":
const id = Symbol("id");
console.log(typeof id); // "symbol"Для звичайних об’єктів оператор typeof повертає "object":
const user = {
name: "Олена",
age: 25
};
console.log(typeof user); // "object"Масиви також є об’єктами:
const colors = ["red", "green", "blue"];
console.log(typeof colors); // "object"Функції мають окремий результат — "function":
function greet() {
console.log("Привіт!");
}
console.log(typeof greet); // "function"Стрілкові функції поводяться так само:
const add = (a, b) => a + b;
console.log(typeof add); // "function"typeof nullДля значення null оператор typeof повертає "object":
console.log(typeof null); // "object"Це давня особливість JavaScript, яку вважають історичною помилкою мови. Насправді null означає відсутність значення, а не звичайний об’єкт.
Тому перевірка лише за допомогою typeof може бути недостатньою:
const value = null;
console.log(typeof value === "object"); // trueЯкщо потрібно перевірити саме null, використовуйте строге порівняння:
console.log(value === null); // trueОператор typeof часто використовують у перевірках:
function printAge(age) {
if (typeof age === "number") {
console.log(`Вік: ${age}`);
} else {
console.log("Вік має бути числом");
}
}
printAge(25); // Вік: 25
printAge("25"); // Вік має бути числомПорівнювати результат потрібно з рядком:
const price = 99;
if (typeof price === "number") {
console.log("Це число");
}Оскільки typeof price повертає рядок "number", правильна перевірка має такий вигляд:
typeof price === "number"const values = [
"JavaScript",
42,
true,
undefined,
null,
{ name: "Олена" },
[1, 2, 3],
function () {}
];
for (const value of values) {
console.log(typeof value);
}
// string
// number
// boolean
// undefined
// object
// object
// object
// functionЗверніть увагу: і null, і об’єкт, і масив дають результат "object".
Оператор typeof не відрізняє масив від звичайного об’єкта:
console.log(typeof [1, 2, 3]); // "object"
console.log(typeof { length: 3 }); // "object"Для перевірки масиву використовуйте Array.isArray():
const numbers = [1, 2, 3];
console.log(Array.isArray(numbers)); // true
console.log(Array.isArray({})); // falseРезультат typeof можна використовувати в умовах:
const username = "Олена";
if (typeof username === "string") {
console.log("Ім’я збережено як рядок");
}Для кількох типів можна використати логічний оператор ||:
function showValue(value) {
if (typeof value === "string" || typeof value === "number") {
console.log(value);
} else {
console.log("Підтримуються лише рядки та числа");
}
}
showValue("Привіт"); // Привіт
showValue(100); // 100
showValue(true); // Підтримуються лише рядки та числаtypeof null поверне "null"console.log(typeof null); // "object"Для перевірки null використовуйте:
value === nulltypeofconsole.log(typeof []); // "object"Використовуйте:
Array.isArray([]);Неправильно:
const age = 30;
console.log(typeof age === number); // Помилкаnumber без лапок сприймається як ім’я змінної. Правильно:
console.log(typeof age === "number"); // trueconst value = "42";
console.log(typeof value); // "string"Хоча рядок містить цифри, це все одно рядок, а не число.
typeof для складної перевірки об’єктівtypeof повідомляє лише загальну категорію значення:
console.log(typeof new Date()); // "object"
console.log(typeof /hello/); // "object"
console.log(typeof [1, 2]); // "object"Для спеціальних перевірок використовуйте відповідні методи або властивості, наприклад Array.isArray() для масивів.
typeof визначає тип значення.
Результат оператора завжди є рядком.
Основні результати: "string", "number", "boolean", "undefined", "bigint", "symbol", "object" і "function".
typeof null повертає "object" — це історична особливість JavaScript.
Для перевірки null використовуйте value === null.
Для перевірки масиву використовуйте Array.isArray(), а не typeof.
typeof зручно застосовувати в умовах для перевірки вхідних даних.