CINXE.COM

<!DOCTYPE html><html lang="uk" data-theme-enabled="1"><head><script>window.currentUser = null;</script><script>window.shopCurrency = "EUR";</script><script>window.localCurrency = "UAH";</script><script>window.countryCode = "ua";</script><script>window.rateShopTo = {"UAH":44.67590181922939,"EUR":1,"USD":1.078956993853182,"AMD":421.5874435300883};</script><title itemprop="name">Типи даних</title><link href="/pack/styles.100020a0bc7cf13be729.css" rel="stylesheet"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes, minimum-scale=1.0"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="google" content="notranslate"><script>if (window.devicePixelRatio > 1) document.cookie = 'pixelRatio=' + window.devicePixelRatio + ';path=/;expires=Tue, 19 Jan 2038 03:14:07 GMT';</script><link href="//fonts.googleapis.com/css?family=Open+Sans:bold,italic,bolditalic" rel="stylesheet"><link rel="apple-touch-icon-precomposed" href="/img/favicon/apple-touch-icon-precomposed.png"><link rel="canonical" href="https://uk.javascript.info/types"><meta name="msapplication-TileColor" content="#222A2C"><meta name="msapplication-TileImage" content="/img/favicon/tileicon.png"><link rel="icon" href="/img/favicon/favicon.png"><meta itemprop="image" content="https://uk.javascript.info/img/site_preview_en_512x512.png"><meta property="og:title" content="Типи даних"><meta property="og:image" content="https://uk.javascript.info/img/site_preview_en_1200x630.png"><meta property="og:image:type" content="image/png"><meta property="og:image:width" content="1200"><meta property="og:image:height" content="630"><meta property="fb:admins" content="100001562528165"><meta name="twitter:card" content="summary"><meta name="twitter:title" content="Типи даних"><meta name="twitter:site" content="@iliakan"><meta name="twitter:creator" content="@iliakan"><meta name="twitter:image" content="https://uk.javascript.info/img/site_preview_en_512x512.png"><meta name="google-adsense-account" content="ca-pub-6204518652652613"><link rel="prev" href="/variables"><link rel="next" href="/alert-prompt-confirm"><script data-collect-dnt="true" async src="https://scripts.simpleanalyticscdn.com/latest.js"></script><script>window.GA_ID = "UA-2056213-15";</script><script>window.YANDEX_METRIKA_ID = 32184394;</script><script>{function gtag(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],gtag("js",new Date),gtag("config","G-2LWB61WGYJ")}</script> <script async src="https://www.googletagmanager.com/gtag/js?id=G-2LWB61WGYJ"></script><script>window.metrika={reachGoal:function(){}},window.yandex_metrika_callbacks=[function(){try{window.metrika=new Ya.Metrika({id:YANDEX_METRIKA_ID,webvisor:!0,clickmap:!0,params:{user:window.currentUser&&window.currentUser.id}}),metrika.trackLinks({delay:150}),window.addEventListener("error",function(r){window.metrika.reachGoal("JSERROR",{src:(r.filename||r.errorUrl)+": "+(r.lineno||r.errorLine),stack:r.stack||r.error&&r.error.stack,message:r.message})})}catch(r){}}];</script><script src="//mc.yandex.ru/metrika/watch.js" async></script><script>window.RECAPTCHA_ID = "6LfmLAEVAAAAAJMykMnf7aY8nkyTRmYi2ynx51R1";</script><script src="/pack/init.2566f7f1af7ea730670b.js"></script><script src="/pack/head.3c29f3d0852906b2e722.js" defer></script><meta property="og:title" content="Типи даних"><meta property="og:type" content="article"><script src="/pack/tutorial.e143b1654fa4e11cdd8b.js" defer></script><script src="/pack/footer.054c9dc1de8c0b8160eb.js" defer></script></head><body class="no-icons"><script>window.fontTest();</script><div class="page-wrapper page-wrapper_sidebar_on"><div class="sitetoolbar sitetoolbar_tutorial"><script>window.langs = [{"code":"ar","name":"Arabic"},{"code":"az","name":"Azerbaijani"},{"code":"bg","name":"Bulgarian"},{"code":"bn","name":"Bengali"},{"code":"bs","name":"Bosnian"},{"code":"ca","name":"Catalan"},{"code":"cs","name":"Czech"},{"code":"da","name":"Danish"},{"code":"de","name":"German"},{"code":"el","name":"Greek"},{"code":"en","name":"English"},{"code":"es","name":"Spanish"},{"code":"fa","name":"Persian (Farsi)"},{"code":"fi","name":"Finnish"},{"code":"fr","name":"French"},{"code":"he","name":"Hebrew"},{"code":"hi","name":"Hindi"},{"code":"hr","name":"Croatian"},{"code":"hu","name":"Hungarian"},{"code":"hy","name":"Armenian"},{"code":"id","name":"Indonesian"},{"code":"it","name":"Italian"},{"code":"ja","name":"Japanese"},{"code":"ka","name":"Georgian"},{"code":"kk","name":"Kazakh"},{"code":"km","name":"Central Khmer"},{"code":"ko","name":"Korean"},{"code":"ku","name":"Kurdish"},{"code":"ky","name":"Kyrgyz"},{"code":"lt","name":"Lithuanian"},{"code":"me","name":"Montenegrin"},{"code":"ml","name":"Malayalam"},{"code":"ms","name":"Malay"},{"code":"my","name":"Burmese"},{"code":"nl","name":"Dutch"},{"code":"no","name":"Norvegian"},{"code":"pa","name":"Punjabi"},{"code":"pl","name":"Polish"},{"code":"pt","name":"Portuguese"},{"code":"ro","name":"Romanian"},{"code":"ru","name":"Russian"},{"code":"si","name":"Sinhala"},{"code":"sk","name":"Slovak"},{"code":"sl","name":"Slovenian"},{"code":"sq","name":"Albanian"},{"code":"sr","name":"Serbian"},{"code":"ta","name":"Tamil"},{"code":"te","name":"Telugu"},{"code":"test","name":"Test"},{"code":"th","name":"Thai"},{"code":"tk","name":"Turkmen"},{"code":"tr","name":"Turkish"},{"code":"ug","name":"Uyghur"},{"code":"uk","name":"Ukrainian"},{"code":"ur","name":"Urdu"},{"code":"uz","name":"Uzbek"},{"code":"v2","name":"v2"},{"code":"vi","name":"Vietnamese"},{"code":"zh-hant","name":"Chinese Traditional"},{"code":"zh","name":"Chinese"}];</script><script>window.lang = "uk";</script><div class="sitetoolbar__content"><div class="sitetoolbar__lang-switcher"><button class="sitetoolbar__dropdown-button" data-dropdown-toggler>UK</button><div class="sitetoolbar__dropdown-wrap"><div class="sitetoolbar__dropdown-body"><div class="sitetoolbar__lang-switcher-body"><div class="supported-langs supported-langs_toolbar"><div class="supported-langs__container"><ul class="supported-langs__list" style="height:200px"><li class="supported-langs__item"><a class="supported-langs__link" href="https://ar.javascript.info/types"><span class="supported-langs__brief">AR</span><span class="supported-langs__title">عربي</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://javascript.info/types"><span class="supported-langs__brief">EN</span><span class="supported-langs__title">English</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://es.javascript.info/types"><span class="supported-langs__brief">ES</span><span class="supported-langs__title">Español</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://fa.javascript.info/types"><span class="supported-langs__brief">FA</span><span class="supported-langs__title">فارسی</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://fr.javascript.info/types"><span class="supported-langs__brief">FR</span><span class="supported-langs__title">Français</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://id.javascript.info/types"><span class="supported-langs__brief">ID</span><span class="supported-langs__title">Indonesia</span></a></li></ul><ul class="supported-langs__list" style="height:200px"><li class="supported-langs__item"><a class="supported-langs__link" href="https://it.javascript.info/types"><span class="supported-langs__brief">IT</span><span class="supported-langs__title">Italiano</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://ja.javascript.info/types"><span class="supported-langs__brief">JA</span><span class="supported-langs__title">日本語</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://ko.javascript.info/types"><span class="supported-langs__brief">KO</span><span class="supported-langs__title">한국어</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://learn.javascript.ru/types"><span class="supported-langs__brief">RU</span><span class="supported-langs__title">Русский</span></a></li><li class="supported-langs__item"><a class="supported-langs__link" href="https://tr.javascript.info/types"><span class="supported-langs__brief">TR</span><span class="supported-langs__title">Türkçe</span></a></li><li class="supported-langs__item supported-langs__item_current"><a class="supported-langs__link" href="https://uk.javascript.info/types"><span class="supported-langs__brief">UK</span><span class="supported-langs__title">Українська</span></a></li></ul><ul class="supported-langs__list" style="height:20px"><li class="supported-langs__item"><a class="supported-langs__link" href="https://zh.javascript.info/types"><span class="supported-langs__brief">ZH</span><span class="supported-langs__title">简体中文</span></a></li></ul></div><div class="supported-langs__text"><p>Ми хочемо зробити цей проєкт з відкритим кодом доступним для людей у всьому світі.</p> <p><a href="https://javascript.info/translate">Допоможіть перекласти</a> цей підручник вашою мовою!</p> </div></div></div></div></div></div><div class="sitetoolbar__logo-wrap"><a class="sitetoolbar__link sitetoolbar__link_logo" href="/"><img class="sitetoolbar__logo sitetoolbar__logo_normal" src="/img/sitetoolbar__logo_en.svg" width="200" alt="" role="presentation"/><img class="sitetoolbar__logo sitetoolbar__logo_normal sitetoolbar__logo_dark" src="/img/sitetoolbar__logo_en-white.svg" width="200" alt="" role="presentation"/><img class="sitetoolbar__logo sitetoolbar__logo_small" src="/img/sitetoolbar__logo_small_en.svg" width="70" alt="" role="presentation"/><img class="sitetoolbar__logo sitetoolbar__logo_small sitetoolbar__logo_dark" src="/img/sitetoolbar__logo_small_en-white.svg" width="70" alt="" role="presentation"/><script>Array.prototype.forEach.call(document.querySelectorAll("img.sitetoolbar__logo"),function(e){let t=document.createElement("object");t.type="image/svg+xml",t.className=e.className,t.style.cssText="left:0;top:0;position:absolute",t.onload=function(){t.onload=null,e.style.visibility="hidden"},t.data=e.src,e.parentNode.insertBefore(t,e)});</script></a></div><div class="sitetoolbar__nav-toggle-wrap"><button class="sitetoolbar__nav-toggle" type="button"></button></div><nav class="sitetoolbar__sections"><ul class="sitetoolbar__sections-list"></ul></nav><div class="sitetoolbar__right-button-wrap"><a class="sitetoolbar-right-button sitetoolbar-right-button_courses" href="/ebook"><span class="sitetoolbar-right-button__extra-text">Купити</span>EPUB/PDF</a></div><div class="sitetoolbar__theme-switcher"><div class="theme-changer"><label class="theme-changer__label" for="theme-changer-input" data-tooltip="Змінити тему"><input class="theme-changer__input" type="checkbox" id="theme-changer-input" data-theme-changer="data-theme-changer"/><span class="theme-changer__icon theme-changer__icon_light-theme"></span><span class="theme-changer__icon theme-changer__icon_dark-theme"></span></label></div></div><div class="sitetoolbar__search-wrap"><div class="sitetoolbar__search-content"><button class="sitetoolbar__search-toggle" type="button"></button><form class="sitetoolbar__search" method="GET" action="/search"><div class="sitetoolbar__search-input"><div class="text-input"><input class="text-input__control" name="query" placeholder="Пошук на Javascript.info" required="required" type="text"/></div><button class="sitetoolbar__find" type="submit">Пошук</button></div></form></div></div></div><div class="tablet-menu"><div class="tablet-menu__line"><div class="tablet-menu__content"><form class="tablet-menu-search" action="/search/"><input class="tablet-menu-search__input" type="search" name="query" placeholder="Пошук у підручнику" required="required"/><button class="tablet-menu-search__button" type="submit" name="type" value="articles">Пошук</button></form></div></div><div class="tablet-menu__line"><div class="tablet-menu__content"><a class="map" href="/tutorial/map" data-action="tutorial-map"><span class="map__text">Навчальна карта</span></a></div></div><div class="tablet-menu__line"><div class="tablet-menu__content"><div class="theme-changer theme-changer_tablet-menu theme-changer_has-label"><label class="theme-changer__label" for="theme-changer-input-tablet" data-tooltip="Змінити тему"><input class="theme-changer__input" type="checkbox" id="theme-changer-input-tablet" data-theme-changer="data-theme-changer"/><span class="theme-changer__icon theme-changer__icon_light-theme"></span><span class="theme-changer__icon theme-changer__icon_dark-theme"></span><span class="theme-changer__label-text theme-changer__label-text_light-theme">Світла тема</span><span class="theme-changer__label-text theme-changer__label-text_dark-theme">Темна тема</span></label></div></div></div><div class="tablet-menu__line"><div class="tablet-menu__content"><div class="share-icons"><span class="share-icons__title">Поділитися</span><a class="share share_tw" href="https://twitter.com/share?url=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a><a class="share share_fb" href="https://www.facebook.com/sharer/sharer.php?s=100&p%5Burl%5D=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a></div></div></div><div class="tablet-menu__line"><div class="tablet-menu__content"><select class="tablet-menu__nav input-select input-select input-select_small" onchange="if(this.value) window.location.href=this.value"><option value="https://ar.javascript.info/types">عربي</option><option value="https://javascript.info/types">English</option><option value="https://es.javascript.info/types">Español</option><option value="https://fa.javascript.info/types">فارسی</option><option value="https://fr.javascript.info/types">Français</option><option value="https://id.javascript.info/types">Indonesia</option><option value="https://it.javascript.info/types">Italiano</option><option value="https://ja.javascript.info/types">日本語</option><option value="https://ko.javascript.info/types">한국어</option><option value="https://learn.javascript.ru/types">Русский</option><option value="https://tr.javascript.info/types">Türkçe</option><option value="https://uk.javascript.info/types" selected>Українська</option><option value="https://zh.javascript.info/types">简体中文</option></select></div></div></div><progress class="tutorial-progress" data-sticky value="9" max="94" data-tooltip="Урок 9 з 94"></progress></div><div class="page page_sidebar_on page_inner_padding"><script>if(localStorage.noSidebar){document.querySelector(".page").classList.remove("page_sidebar_on");let e=document.querySelector(".page-wrapper");e&&e.classList.remove("page-wrapper_sidebar_on")}setTimeout(function(){document.querySelector(".page").classList.add("page_sidebar-animation-on")});</script><div class="page__inner"><main class="main main_width-limit"><header class="main__header"><div class="main__header-inner"><div class="main__header-group"><ol class="breadcrumbs"><li class="breadcrumbs__item breadcrumbs__item_home"><a class="breadcrumbs__link" href="/"><span class="breadcrumbs__hidden-text">Підручник</span></a></li><li class="breadcrumbs__item" id="breadcrumb-1"><a class="breadcrumbs__link" href="/js"><span>Мова програмування JavaScript</span></a></li><li class="breadcrumbs__item" id="breadcrumb-2"><a class="breadcrumbs__link" href="/first-steps"><span>Основи JavaScript</span></a></li><script type="application/ld+json">{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Підручник","item":"https://uk.javascript.info/"},{"@type":"ListItem","position":2,"name":"Мова програмування JavaScript","item":"https://uk.javascript.info/js"},{"@type":"ListItem","position":3,"name":"Основи JavaScript","item":"https://uk.javascript.info/first-steps"}]}</script></ol><div class="updated-at" data-tooltip="Останнє оновлення: 21 вересня 2023 р."><div class="updated-at__content">21 вересня 2023 р.</div></div></div><h1 class="main__header-title">Типи даних</h1></div></header><div class="content"><article class="formatted" itemscope itemtype="http://schema.org/TechArticle"><meta itemprop="name" content="Типи даних"><div itemprop="author" itemscope itemtype="http://schema.org/Person"><meta itemprop="email" content="iliakan@gmail.com"><meta itemprop="name" content="Ilya Kantor"></div><div itemprop="articleBody"><p>Значення в JavaScript завжди має певний тип даних. Наприклад, рядок або число.</p> <p>У JavaScript є вісім основних типів даних. У цьому розділі ми розглянемо їх в цілому, а в наступних — детально поговоримо про кожен з них.</p> <p>Ми можемо призначити змінній будь-який тип даних. Наприклад, в один момент змінна може бути рядком, а в інший – числом:</p> <div id="cxt5t5kmrk" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>// тут не буде помилки let message = "привіт"; message = 123456;</code></pre> </div> </div> </div><p>Мови програмування, які дають змогу таке робити, називаються “динамічно типізованими”. Мається на увазі, що типи даних визначені, але змінні не прив’язанні до жодного типу.</p> <h2><a class="main__anchor" name="chislo-number" href="#chislo-number">Число (number)</a></h2><div id="6yk1qqpzrj" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let n = 123; n = 12.345;</code></pre> </div> </div> </div><p>Тип <em>number</em> представляє і цілі числа, і числа з рухомою точкою.</p> <p>Є багато операцій, що можна робити з числами, наприклад, множення <code>*</code>, ділення <code>/</code>, додавання <code>+</code>, віднімання <code>-</code> тощо.</p> <p>Окрім звичайних чисел, є так звані “спеціальні числові значення”, що також мають відношення до цього типу даних: <code>Infinity</code>, <code>-Infinity</code> і <code>NaN</code>.</p> <ul> <li> <p><code>Infinity</code> являє собою математичну <a href="https://uk.wikipedia.org/wiki/%D0%9D%D0%B5%D1%81%D0%BA%D1%96%D0%BD%D1%87%D0%B5%D0%BD%D0%BD%D1%96%D1%81%D1%82%D1%8C">нескінченність</a> ∞. Це спеціальне значення, що є більшим за будь-яке число.</p> <p>Ми можемо отримати його як результат ділення на нуль:</p> <div id="lsj1k7xwml" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>alert(1 / 0); // Infinity</code></pre> </div> </div> </div><p>Або безпосередньо посилатися на нього:</p> <div id="ac87h0sb77" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>alert(Infinity); // Infinity</code></pre> </div> </div> </div></li> <li> <p><code>NaN</code> (Not a Number) являє собою помилку обчислення. Це є результат неправильної або невизначеної математичної операції, наприклад:</p> <div id="dnujvzi7i9" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>alert("not a number" / 2); // NaN, таке ділення є помилковим</code></pre> </div> </div> </div><p><code>NaN</code> є “причепливим” (“заразливим”). Будь-яка подальша математична операція з <code>NaN</code> повертає <code>NaN</code>:</p> <div id="nuh9d4og6g" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>alert( NaN + 1 ); // NaN alert( 3 * NaN ); // NaN alert( "not a number" / 2 - 1 ); // NaN</code></pre> </div> </div> </div><p>Отже, якщо десь у математичному виразі є <code>NaN</code>, він поширюється на весь результат (є лише один виняток: результатом операції <code>NaN ** 0</code> буде <code>1</code>).</p> </li> </ul> <div class="important important_smart"> <div class="important__header"><span class="important__type">Математичні операції є безпечними</span></div> <div class="important__content"><p>Обчислення є “безпечним” в JavaScript. Ми можемо робити будь-що: ділити на нуль, звертатися до нечислового рядка як до числа тощо.</p> <p>Виконання скрипту ніколи не зупиниться з фатальною помилкою (не “вмре”). У найгіршому випадку ми отримаємо в результаті <code>NaN</code>.</p> </div></div> <p>Спеціальні числові значення формально належать до типу “number”. Хоча, звісно, вони не є числами у загальноприйнятому розумінні.</p> <p>Докладніше роботу з числами ми розглянемо у розділі <a href="/number">Числа</a>.</p> <h2><a class="main__anchor" name="bigint-type" href="#bigint-type">BigInt</a></h2><p>У JavaScript, тип “number” не може містити числа більші за <code>(2<sup>53</sup>-1)</code> (це <code>9007199254740991</code>), або менші за <code>-(2<sup>53</sup>-1)</code> для від’ємних чисел.</p> <p>Якщо бути дійсно точним, тип “number” може зберігати більші цілі числа (до <code>1,7976931348623157 * 10<sup>308</sup></code>), але поза межами безпечного діапазону цілих чисел <code>±(2 <sup>53</sup>-1)</code> виникне помилка точності, оскільки не всі цифри вміщуються у фіксованому 64-бітному сховищі. Тому може бути збережено “приблизне” значення.</p> <p>Наприклад, ці два числа (прямо над безпечним діапазоном) однакові:</p> <div id="iil9fladvq" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>console.log(9007199254740991 + 1); // 9007199254740992 console.log(9007199254740991 + 2); // 9007199254740992</code></pre> </div> </div> </div><p>Таким чином, усі непарні цілі числа, більші за <code>(2<sup>53</sup>-1)</code>, взагалі не можна зберігати в типі “number”.</p> <p>Для більшості задач діапазону <code>±(2<sup>53</sup>-1)</code> цілком достатньо, але інколи нам потрібен весь діапазон дійсно великих цілих чисел, напр. для криптографії або міток часу з точністю до мікросекунд.</p> <p>Нещодавно в мову був доданий тип <code>BigInt</code> для представлення цілих чисел довільної довжини.</p> <p>Значення з типом <code>BigInt</code> створюється через додавання <code>n</code> у кінець цілого числа:</p> <div id="sq9u08e0ig" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>// буква "n" у кінці означає, що це число типу BigInt const bigInt = 1234567890123456789012345678901234567890n;</code></pre> </div> </div> </div><p>Через те, що тип <code>BigInt</code> рідко використовується, ми не розглядатимемо його в цьому розділі, проте ми винесли його в окремий розділ <a href="/bigint">BigInt</a>. Прочитайте його, якщо вам потрібні такі великі числа.</p> <div class="important important_smart"> <div class="important__header"><span class="important__type">Проблеми із сумісністю</span></div> <div class="important__content"><p>Цієї миті, підтримка типу <code>BigInt</code> є в останніх версіях Firefox/Chrome/Edge/Safari, але не в IE.</p> </div></div> <p>На сайті <em>MDN</em> є <a href="https://developer.mozilla.org/uk/docs/Web/JavaScript/Reference/Global_Objects/BigInt#%D0%A1%D1%83%D0%BC%D1%96%D1%81%D0%BD%D1%96%D1%81%D1%82%D1%8C_%D0%B7_%D0%B2%D0%B5%D0%B1-%D0%BF%D0%B5%D1%80%D0%B5%D0%B3%D0%BB%D1%8F%D0%B4%D0%B0%D1%87%D0%B0%D0%BC%D0%B8">таблиця сумісності</a>, де показано, які версії браузерів підтримують тип <code>BigInt</code>.</p> <h2><a class="main__anchor" name="ryadok-string" href="#ryadok-string">Рядок (string)</a></h2><p>Рядок у JavaScript має бути оточений лапками.</p> <div id="j24evqcjwd" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let str = "Привіт"; let str2 = 'Одинарні лапки також дозволяються'; let phrase = `так можна вставляти ${str}`;</code></pre> </div> </div> </div><p>У JavaScript є три типи лапок.</p> <ol> <li>Подвійні лапки: <code>"Привіт"</code>.</li> <li>Одинарні лапки: <code>'Привіт'</code>.</li> <li>Зворотні лапки: <code>`Привіт`</code>.</li> </ol> <p>Подвійні та одинарні лапки є “звичайними”. Тобто немає ніякої різниці, які саме використовувати.</p> <p>Зворотні лапки є розширенням функціональності. Вони дають змогу вбудовувати змінні та вирази в рядок, обрамляючи їх в <code>${…}</code>, наприклад:</p> <div id="vbr2l0aq5u" data-trusted="1" class="code-example" data-highlight="[{"start":6,"cols":[{"start":18,"end":26}]},{"start":3,"cols":[{"start":15,"end":22}]}]"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let name = "Іван"; // вбудована змінна alert(`Привіт, ${name}е!`); // Привіт, Іване! // вбудований вираз alert(`результат: ${1 + 2}`); // результат: 3</code></pre> </div> </div> </div><p>Вираз всередині <code>${…}</code> обчислюється, а результат обчислення стає частиною рядка. Ми можемо вбудувати будь-що: змінну <code>name</code>, або арифметичний вираз <code>1 + 2</code>, або щось набагато складніше.</p> <p>Будь ласка, зауважте, що вбудовування можна робити тільки зі зворотними лапками. Інші типи лапок не мають функціональності вбудовування!</p> <div id="tlfl2ypfcy" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>alert("результат: ${1 + 2}"); // результат: ${1 + 2} (подвійні лапки не мають ніякого впливу)</code></pre> </div> </div> </div><p>Більш детально ми будемо висвітлювати рядки в розділі <a href="/string">Рядки</a>.</p> <div class="important important_smart"> <div class="important__header"><span class="important__type">Немає типу <em>символ</em> (<em>character</em>).</span></div> <div class="important__content"><p>У деяких мовах є спеціальний тип “character” для позначення єдиного символу. Наприклад, у мовах C та Java це <code>char</code>.</p> <p>У JavaScript немає такого типу. Є єдиний тип: <code>string</code>. Рядок може містити нуль символів (бути пустим), один символ або більше.</p> </div></div> <h2><a class="main__anchor" name="bulevii-abo-logichnii-tip-boolean" href="#bulevii-abo-logichnii-tip-boolean">Булевий або логічний тип (boolean)</a></h2><p>Логічний тип може приймати лише два значення: <code>true</code> (істина) та <code>false</code> (хиба).</p> <p>Цей тип зазвичай використовується для зберігання значень так/ні: <code>true</code> означає “так, вірно”, а <code>false</code> означає “ні, не вірно”.</p> <p>Наприклад:</p> <div id="nk8ofjo5tm" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let nameFieldChecked = true; // так, ім’я було перевірене let ageFieldChecked = false; // ні, вік не був перевіреним</code></pre> </div> </div> </div><p>Логічне значення також можна отримати як результат порівняння:</p> <div id="v9sqcf9so" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let isGreater = 4 > 1; alert(isGreater); // true (результат порівняння — "так")</code></pre> </div> </div> </div><p>Більш глибоко ми охопимо булеві значення у розділі <a href="/logical-operators">Логічні оператори</a>.</p> <h2><a class="main__anchor" name="znachennya-null" href="#znachennya-null">Значення “null”</a></h2><p>Спеціальне значення <code>null</code> не належить до жодного з описаних вище типів.</p> <p>Воно формує окремий власний тип, який містить лише значення <code>null</code>:</p> <div id="lh3atqnnzj" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let age = null;</code></pre> </div> </div> </div><p>В JavaScript <code>null</code> не є “посиланням на об’єкт, що не існує” або “покажчиком на null”, як може бути в інших мовах програмування.</p> <p>Це лише спеціальне значення, яке представляє “нічого”, “порожнє” або “невідоме значення”.</p> <p>У наведеному вище коді зазначено, що значення змінної <code>age</code> невідоме.</p> <h2><a class="main__anchor" name="znachennya-undefined" href="#znachennya-undefined">Значення “undefined”</a></h2><p>Спеціальне значення <code>undefined</code> також стоїть окремо. Воно представляє власний тип, подібний до “null”.</p> <p><code>undefined</code> означає, що “значення не присвоєно”.</p> <p>Якщо змінна оголошена, але їй не присвоєне якесь значення, тоді значення такої змінної буде <code>undefined</code>:</p> <div id="1o5rebqkne" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let age; alert(age); // покаже "undefined"</code></pre> </div> </div> </div><p>Технічно, є можливість явно призначити <code>undefined</code> змінній:</p> <div id="cnmgyggqxx" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let age = 100; // змінюємо значення на undefined age = undefined; alert(age); // "undefined"</code></pre> </div> </div> </div><p>…Але ми не рекомендуємо так робити. Як правило, ми використовуємо <code>null</code>, щоби присвоїти змінній значення “порожнє” або “невідоме”, тоді як <code>undefined</code> зарезервоване для позначення початкового значення для не присвоєних речей.</p> <h2><a class="main__anchor" name="obyekti-object-ta-simvoli-symbol" href="#obyekti-object-ta-simvoli-symbol">Об’єкти (object) та символи (symbol)</a></h2><p>Тип <code>object</code> є особливим типом.</p> <p>Усі інші типи називаються “примітивами”, тому що їхні значення можуть містити тільки один елемент (це може бути рядок, число, або будь-що інше). В об’єктах же зберігаються колекції даних і складніші структури.</p> <p>Об’єкти є важливою частиною мови, тому ми окремо розглянемо їх у розділі <a href="/object">Об’єкти</a> після того, як дізнаємося більше про примітиви.</p> <p>Тип <code>symbol</code> використовується для створення унікальних ідентифікаторів в об’єктах. Ми згадали цей тип для повноти, проте докладніше вивчимо його після об’єктів.</p> <h2><a class="main__anchor" name="type-typeof" href="#type-typeof">Оператор typeof</a></h2><p>Оператор <code>typeof</code> повертає тип аргументу. Це корисно, коли ми хочемо обробляти значення різних типів по-різному або просто хочемо зробити швидку перевірку.</p> <p>Виклик <code>typeof x</code> повертає рядок із назвою типу:</p> <div id="w318w0is78" data-trusted="1" class="code-example" data-highlight="[{"start":16,"end":16},{"start":14,"end":14},{"start":12,"end":12}]"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>typeof undefined // "undefined" typeof 0 // "number" typeof 10n // "bigint" typeof true // "boolean" typeof "foo" // "string" typeof Symbol("id") // "symbol" typeof Math // "object" (1) typeof null // "object" (2) typeof alert // "function" (3)</code></pre> </div> </div> </div><p>Останні три рядки можуть потребувати додаткового пояснення:</p> <ol> <li><code>Math</code> — це вбудований об’єкт, який забезпечує математичні операції. Ми вивчимо його в розділі <a href="/number">Числа</a>. Тут він використаний лише як приклад об’єкта.</li> <li>Результатом <code>typeof null</code> є <code>"object"</code>. Це офіційно визнана помилка поведінки <code>typeof</code>, що є ще з ранніх днів JavaScript і зберігається для сумісності. Безперечно, <code>null</code> не є об’єктом. Це особливе значення з власним типом. У цьому разі поведінка <code>typeof</code> некоректна.</li> <li>Результатом <code>typeof alert</code> є <code>"function"</code>, тому що <code>alert</code> — це функція. Ми будемо вивчати функції в наступних розділах, де ми також побачимо, що в JavaScript немає спеціального типу “function”. Функції належать до типу “об’єкт”. Але <code>typeof</code> трактує їх по-іншому, повертаючи <code>"function"</code>. Це також присутнє з ранніх днів JavaScript. Технічно, така поведінка не зовсім правильна, але може бути зручною на практиці.</li> </ol> <div class="important important_smart"> <div class="important__header"><span class="important__type">Синтаксис <code>typeof(x)</code></span></div> <div class="important__content"><p>Можливо ви зустрічали інший синтаксис: <code>typeof(x)</code>. Це те саме, що <code>typeof x</code>.</p> <p>Щоби було зрозуміло: <code>typeof</code> – це оператор, а не функція. Тут дужки не є частиною <code>typeof</code>. Це щось на кшталт математичних дужок для групування.</p> <p>Зазвичай, такі дужки містять математичні вирази, як <code>(2 + 2)</code>, але тут вони містять лише один аргумент <code>(x)</code>. Ці дужки дають змогу опустити пробіл між оператором <code>typeof</code> та його аргументом, і декому це подобається.</p> <p>Тому вони надають перевагу синтаксису <code>typeof(x)</code>, проте синтаксис <code>typeof x</code> набагато поширеніший.</p> </div></div> <h2><a class="main__anchor" name="pidsumki" href="#pidsumki">Підсумки</a></h2><p>У JavaScript є 8 основних типів.</p> <ul> <li> <p>Сім примітивних типів даних:</p> <ul> <li><code>number</code> для будь-яких чисел: цілих або з рухомою точкою. Цілі числа обмежені до <code>±(2<sup>53</sup>-1)</code>.</li> <li><code>bigint</code> для цілих чисел довільної довжини.</li> <li><code>string</code> для рядків. Рядок може мати нуль або більше символів, немає окремого типу для одного символу.</li> <li><code>boolean</code> для <code>true</code>/<code>false</code>.</li> <li><code>null</code> для невідомих значень – автономний тип, який має єдине значення <code>null</code>.</li> <li><code>undefined</code> для не присвоєних значень – автономний тип, який має єдине значення <code>undefined</code>.</li> <li><code>symbol</code> для унікальних ідентифікаторів.</li> </ul> </li> <li> <p>І один непримітивний тип даних:</p> <ul> <li><code>object</code> для складних структур даних.</li> </ul> </li> </ul> <p>Оператор <code>typeof</code> дає змогу нам бачити, який тип зберігається в змінній.</p> <ul> <li>Зазвичай використовують синтаксис <code>typeof x</code>, проте <code>typeof(x)</code> також можливий.</li> <li>Повертає рядок із назвою типу, як-от <code>"string"</code>.</li> <li>Для <code>null</code> повертає <code>"object"</code> – це помилка в мові, <code>null</code> насправді не об’єкт.</li> </ul> <p>У наступних розділах ми зосередимося на примітивних значеннях, а коли ознайомимося з ними, то перейдемо до об’єктів.</p> </div></article><div class="tasks formatted"><h2 class="tasks__title" id="tasks"><a class="tasks__title-anchor main__anchor main__anchor main__anchor_noicon" href="#tasks">Завдання</a></h2><div class="task tasks__task"><div class="task__header"><div class="task__title-wrap"><h3 class="task__title"><a class="main__anchor" href="#lapki-u-ryadkakh" name="lapki-u-ryadkakh">Лапки у рядках</a></h3><a class="task__open-link" href="/task/string-quotes" target="_blank"></a></div><div class="task__header-note"><span class="task__importance" title="Наскільки важливим є завдання, від 1 до 5">важливість: 5</span></div><div class="task__content"><div class="task__formatted"><p>Який буде результат виконання скрипту?</p> <div id="ysd3o9x1vl" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let name = "Ілля"; alert( `привіт ${1}` ); // ? alert( `привіт ${"name"}` ); // ? alert( `привіт ${name}` ); // ?</code></pre> </div> </div> </div></div><button class="task__solution" type="button">рішення</button><div class="task__answer"><div class="task__answer-content"><div class="formatted"><p>Зворотні лапки вбудовують вираз, що знаходиться всередині <code>${...}</code>, у рядок.</p> <div id="mg7fhkuf8d" data-trusted="1" class="code-example"> <div class="codebox code-example__codebox"> <div class="toolbar codebox__toolbar"> <div class="toolbar__tool"> <a href="#" title="запустити" data-action="run" class="toolbar__button toolbar__button_run"></a> </div> <div class="toolbar__tool"> <a href="#" title="відкрити в пісочниці" target="_blank" data-action="edit" class="toolbar__button toolbar__button_edit"></a> </div> </div> <div class="codebox__code" data-code="1"> <pre class="line-numbers language-javascript"><code>let name = "Ілля"; // вираз — число 1 alert( `привіт ${1}` ); // привіт 1 // вираз є рядком "name" alert( `привіт ${"name"}` ); // привіт name // вираз є змінною, яка вбудовується alert( `привіт ${name}` ); // привіт Ілля</code></pre> </div> </div> </div></div></div><button class="close-button task__answer-close" type="button" title="закрити"></button></div></div></div></div></div></div><div class="page__nav-wrap"><a class="page__nav page__nav_prev" href="/variables" data-tooltip="Змінні"><span class="page__nav-text"><span class="page__nav-text-shortcut"></span></span><span class="page__nav-text-alternate">Попередній урок</span></a><a class="page__nav page__nav_next" href="/alert-prompt-confirm" data-tooltip="Взаємодія: alert, prompt, confirm"><span class="page__nav-text"><span class="page__nav-text-shortcut"></span></span><span class="page__nav-text-alternate">Наступний урок</span></a></div><div class="article-tablet-foot tablet-only"><div class="article-tablet-foot__layout"><div class="share-icons"><span class="share-icons__title">Поділитися</span><a class="share share_tw" href="https://twitter.com/share?url=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a><a class="share share_fb" href="https://www.facebook.com/sharer/sharer.php?s=100&p%5Burl%5D=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a></div><div class="article-tablet-foot__map"><a class="map" href="/tutorial/map" data-action="tutorial-map"><span class="map__text">Навчальна карта</span></a></div></div></div><div class="comments formatted" id="comments"><div class="comments__header"><h2 class="comments__header-title"><a href="#comments" name="comments">Коментарі</a></h2><div class="comments__read-before"><span class="comments__read-before-link">прочитайте це, перш ніж коментувати…</span><div class="comments__read-before-popup"><div class="comments__read-before-popup-i"><ul><li>Якщо у вас є пропозиції, щодо покращення підручника, будь ласка, <a href="https://github.com/javascript-tutorial/uk.javascript.info/issues/new">створіть обговорення на GitHub</a> або одразу створіть запит на злиття зі змінами.</li><li>Якщо ви не можете зрозуміти щось у статті, спробуйте покращити її, будь ласка.</li><li>Щоб вставити код, використовуйте тег <code><code></code>, для кількох рядків – обгорніть їх тегом <code><pre></code>, для понад 10 рядків – використовуйте пісочницю (<a href='https://plnkr.co/edit/?p=preview'>plnkr</a>, <a href='https://jsbin.com'>jsbin</a>, <a href='http://codepen.io'>codepen</a>…)</li></ul></div></div></div></div><div id="disqus_thread"></div><script>var disqus_config = function() { if (!this.page) this.page = {}; Object.assign(this.page, {"url":"https:\/\/uk.javascript.info\/types","identifier":"\/types"}); };</script><script>var disqus_shortname = "uk-javascript-info";</script><script>var disqus_enabled = true;</script></div></script></main></div><div class="sidebar page__sidebar sidebar sidebar_sticky-footer"><button class="sidebar__toggle" data-sidebar-toggle></button><a class="map" href="/tutorial/map" data-action="tutorial-map" data-tooltip="Навчальна карта"></a><div class="sidebar__inner"><div class="sidebar__content"><div class="sidebar__section"><h4 class="sidebar__section-title">Глава</h4><nav class="sidebar__navigation"><ul class="sidebar__navigation-links"><li class="sidebar__navigation-link"><a class="sidebar__link" href="/first-steps">Основи JavaScript</a></li></ul></nav></div><div class="sidebar__section"><h4 class="sidebar__section-title">Навігація по уроку</h4><nav class="sidebar__navigation"><ul class="sidebar__navigation-links"><li class="sidebar__navigation-link"><a class="sidebar__link" href="#chislo-number">Число (number)</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#bigint-type">BigInt</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#ryadok-string">Рядок (string)</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#bulevii-abo-logichnii-tip-boolean">Булевий або логічний тип (boolean)</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#znachennya-null">Значення “null”</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#znachennya-undefined">Значення “undefined”</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#obyekti-object-ta-simvoli-symbol">Об’єкти (object) та символи (symbol)</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#type-typeof">Оператор typeof</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#pidsumki">Підсумки</a></li></ul></nav></div><div class="sidebar__section"><nav class="sidebar__navigation"><ul class="sidebar__navigation-links"><li class="sidebar__navigation-link"><a class="sidebar__link" href="#tasks">Завдання (1)</a></li><li class="sidebar__navigation-link"><a class="sidebar__link" href="#comments">Коментарі</a></li></ul></nav></div><div class="sidebar__section"><div class="sidebar__section-title">Поділитися</div><a class="share share_tw sidebar__share" href="https://twitter.com/share?url=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a><a class="share share_fb sidebar__share" href="https://www.facebook.com/sharer/sharer.php?s=100&p[url]=https%3A%2F%2Fuk.javascript.info%2Ftypes" rel="nofollow"></a></div><div class="sidebar__section"><a class="sidebar__link" href="https://github.com/javascript-tutorial/uk.javascript.info/blob/master/1-js/02-first-steps/05-types" rel="nofollow">Редагувати на GitHub</a></div></div></div></div></div></div><div class="page-footer"><ul class="page-footer__list"><li class="page-footer__item page-footer__item_copy">© 2007—2025  Ілля Кантор</li><li class="page-footer__item page-footer__item_about"><a class="page-footer__link" href="/about">про проєкт</a></li><li class="page-footer__item page-footer__item_contact"><a class="page-footer__link" href="/about#contact-us">зв’яжіться з нами</a></li></ul></div></body></html>