{"id":2262,"date":"2021-05-28T20:53:15","date_gmt":"2021-05-29T01:53:15","guid":{"rendered":"https:\/\/www.pensemosweb.com\/?p=2262"},"modified":"2024-04-05T16:09:19","modified_gmt":"2024-04-05T22:09:19","slug":"tipos-de-datos-en-javascript-lo-que-no-te-ensenaron","status":"publish","type":"post","link":"https:\/\/pensemosweb.com\/en\/tipos-de-datos-en-javascript-lo-que-no-te-ensenaron\/","title":{"rendered":"Data types in Javascript, what they didn&#039;t teach you"},"content":{"rendered":"<h2 class=\"wp-block-heading\">Introduction<\/h2>\n\n\n\n<p>Data types in Javascript are a little different compared to other programming languages like C or JAVA.<\/p>\n\n\n\n<p>JavaScript is a weakly typed language, this means that it is not necessary to define the data type. But it is not that it does not have types, since the data type is defined at run time by Javascript.<\/p>\n\n\n\n<p>This behavior and specification of data types applies to any place where javascript is executed, whether in the browser, in node.js, mongodb, or any tool that uses Javascript.<\/p>\n\n\n\n<p>Now if we analyze the concept of types a little, when you make a sum between numbers in the real world you don&#039;t care what type it is, you only care that they can be added, regardless of whether it is an integer or decimal. These subtypes of numbers are still part of the set of real numbers, and are used in real life. <\/p>\n\n\n\n<p>Javascript allows us to apply this thinking and with that we save many type comparisons. There will be times when we have no choice but to convert or compare them, but the less we do it, the simpler our code will be, and therefore easier to understand and faster to execute.<\/p>\n\n\n\n<p>It is said that Javascript has a dynamic data type system, this is because the variables that are created can receive any other type of data at any time, and change type depending on the value they store. What we are really interested in is the value and what we can do with that value, not so much the type. <\/p>\n\n\n\n<p>Later we will see some conversions and comparisons that can confuse and complicate the code, the recommendation is to reduce their use as much as possible. Although we will not see each type in great detail, we will see more important things necessary to use data types in Javascript.<\/p>\n\n\n\n<p>It is useful to know how to define variables and constants, if you do not know how to create a variable or a constant, you can review <a href=\"https:\/\/pensemosweb.com\/en\/variables-en-javascript-y-constantes\/\">this information<\/a> before continuing.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"datosprimitivos\">Primitive data types<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>It is one that is not an object<\/li>\n\n\n\n<li>It has no methods.<\/li>\n\n\n\n<li>They are immutable<\/li>\n\n\n\n<li>We have seven&nbsp;<strong>guys<\/strong> <strong>primitive data<\/strong> in Javascript.<\/li>\n<\/ul>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>number<\/strong>, numbers like; <code>1<\/code>, <code>0<\/code>, <code>18500<\/code>, <code>89.95124<\/code><\/li>\n\n\n\n<li><strong>BigInt<\/strong>, added in 2020, to represent very, very large integers, <code>99999999999999n<\/code><\/li>\n\n\n\n<li><strong>String<\/strong>, character string like <code>&#039;Hello&#039;<\/code> and <code>&quot;Good night&quot;<\/code>.<\/li>\n\n\n\n<li><strong>Boolean<\/strong>, only accept <code>true<\/code> either <code>false<\/code>, that is, yes or no.<\/li>\n\n\n\n<li><strong>null<\/strong>, serves to indicate that something is nothing, its only value is <code>null<\/code>.<\/li>\n\n\n\n<li><strong>undefined<\/strong>, serves to indicate that something is not yet defined.<\/li>\n\n\n\n<li><strong>symbol<\/strong>, added in 2015, with EcmaScript 6<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Data Types Objects<\/h3>\n\n\n\n<p>All other data types in Javascript are objects. In the section <strong>Objects<\/strong> there is the explanation.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">number<\/h2>\n\n\n\n<p>If I had written this before 2020, I would tell you that there is only one numeric data type, unfortunately (with some exceptions) a new numeric value called <strong>BigInt<\/strong>. In this section we will pretend that it does not exist. <\/p>\n\n\n\n<p><strong>number<\/strong> is a value <strong>64 bit float<\/strong>, that is, it is a number <strong>double<\/strong> In other programming languages, this is basically the only numeric data type in JavaScript, there are no integers (except for BigInt), decimals, floats or doubles. Its specification is provided by <strong>IEEE-754<\/strong>.<\/p>\n\n\n\n<p>The way to define and use them is very simple, you simply write the number, it does not matter if it is integer or decimal, floating point or double, as we mentioned before, all of these will be of type double for javascript. This is the recommended way to define them.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const edad = 33;const PI = 3.1416;const descuento = 0.30;const pesoEnDolares = 0.05; \/\/ que tristeza xD!!edad + descuento; \/\/ 33.30, no nos interesa el tipo, solo la suma\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> edad <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">33<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> PI <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">3.1416<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> descuento <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">0.30<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> pesoEnDolares <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">0.05<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ que tristeza xD!!<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">edad <\/span><span style=\"color: #89DDFF\">+<\/span><span style=\"color: #BABED8\"> descuento<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 33.30, no nos interesa el tipo, solo la suma<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>As we see in the last line, we can add integers and decimals without any problem, we are not interested in the type, we are interested in the ability to add them.<\/p>\n\n\n\n<p>Float values are known to have a certain precision error when performing arithmetic operations, the most obvious operation being division.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"0.2 + 0.1; \/\/ es igual a 0.30000000000000004\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F78C6C\">0.2<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">+<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">0.1<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a 0.30000000000000004<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>As we see, it does not give us an exact value of 0.<code>3<\/code>, to mitigate this you can multiply the values by <code>100<\/code> and then divide the result by <code>100<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"(0.2 * 100 + 0.1 * 100)\/100; \/\/ es igual a 0.3\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">0.2<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">100<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">+<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">0.1<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">100<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">\/<\/span><span style=\"color: #F78C6C\">100<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a 0.3<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">NaN<\/h3>\n\n\n\n<p>There is a special number called <strong><code>NaN<\/code><\/strong>. This value is the error of an operation with numbers. <\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"25 * undefined; \/\/ es igual a NaN25 * {}; \/\/ es igual a NaN\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F78C6C\">25<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">undefined;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F78C6C\">25<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{};<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a NaN<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Any operation you have <strong><code>NaN<\/code><\/strong> as one of its operands, will result in <strong><code>NaN<\/code><\/strong>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"25 * NaN; \/\/ es igua a NaN25 + NaN; \/\/ es igual a NaN\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #F78C6C\">25<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">NaN;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igua a NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F78C6C\">25<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">+<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">NaN;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a NaN<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p><code><strong>NaN<\/strong><\/code> it is not even equal to NaN<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"NaN === NaN; \/\/ es igual a falseNaN == NaN; \/\/ es igual a false\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF\">NaN<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">NaN;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">NaN<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">==<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">NaN;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ es igual a false<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>To mitigate this strange behavior, it is recommended to use the method <code><strong>Number.isNaN()<\/strong><\/code>, there is also a global function called <code><strong>isNaN()<\/strong><\/code>, but due to the implicit functionality of Javascript in wanting to convert between types automatically, it can give us very strange results. So as a recommendation always use <code><strong>Number.isNaN()<\/strong><\/code>. This last function checks if the type is <code>number<\/code> and equal to <code>NaN<\/code>, any other value will return  <code>false<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"\/\/ Usando funcion globalisNaN('jaime'); \/\/ true --&gt; Esto esta mal, deberia seguir regresando false\/\/ lo que realmente hace es una conversion automaticaconst result = Number('jaime'); \/\/ NaNisNaN(result); \/\/ trueNumber.isNaN('343434'); \/\/ falseNumber.isNaN('jaime'); \/\/falseNumber.isNaN(1 + undefined); \/\/ true\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ Usando funcion global<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">isNaN<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true --&gt; Esto esta mal, deberia seguir regresando false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ lo que realmente hace es una conversion automatica<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> result <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">isNaN<\/span><span style=\"color: #BABED8\">(result)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">isNaN<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">343434<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">isNaN<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">isNaN<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">+<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>We can see in the first example that the global function returns <code>true<\/code> when it should be <code>false<\/code>, this is due to the automatic type conversion that javascript does.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Function <code>Number(value)<\/code><\/h3>\n\n\n\n<p>You can convert a value to a number using the function <code>Number(value)<\/code>, just be careful because this function can return <code>0<\/code> for many values, as well as <code>NaN<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"Number('5'); \/\/ 5Number(''); \/\/ 0Number(undefined); \/\/ NaNNumber(null); \/\/ 0Number('8778jaime'); \/\/ NaNNumber(false); \/\/ 0Number(true); \/\/ 1;Number({}); \/\/ NaNNumber([]); \/\/ 0\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">5<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 5<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 0<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">null<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 0<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">8778jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 0<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 1;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">([])<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 0<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Number.parseInt and Number.parseFloat<\/h3>\n\n\n\n<p>Finally we have the functions <code>Number.parseInt(value)<\/code> and <code>Number.parseFloat(value)<\/code>, if the value is not a string, then convert it to string using the method <code>.toString()<\/code> before converting to <code>number<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"Number.parseInt(''); \/\/ NaNNumber.parseInt('78.5jaime'); \/\/ 78Number.parseInt(78.58977); \/\/ 78Number.parseFloat(''); \/\/ NaNNumber.parseFloat('78.5jaime'); \/\/ 78.5\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">parseInt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">parseInt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">78.5jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 78<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">parseInt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">78.58977<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 78<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">parseFloat<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ NaN<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">number<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">parseFloat<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">78.5jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 78.5<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">BigInt<\/h2>\n\n\n\n<p>This type of value is new, added to the language in 2020, it is used to represent very large integer values, especially for mathematical calculations with very large quantities.<\/p>\n\n\n\n<p>To use this type of data, the letter is added to the number <code><strong>n<\/strong><\/code> in the end. This is the recommended way.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const enteroMuyGrante = 999999999999999999999999999999999999999999999999999n;const otroEnteroMuyGrande = 55555555555555555555555555555555555555555555555n;const result = enteroMuyGrande * otroEnteroMuyGrande; \/\/\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> enteroMuyGrante <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">999999999999999999999999999999999999999999999999999<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> otroEnteroMuyGrande <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">55555555555555555555555555555555555555555555555<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> result <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> enteroMuyGrande <\/span><span style=\"color: #89DDFF\">*<\/span><span style=\"color: #BABED8\"> otroEnteroMuyGrande<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Operations can be performed between the Number type and the BigInt, but because conversion between types can cause loss of precision, it is recommended to only use values <strong>BigInt when values greater than 2 are being used<sup>53<\/sup> and only perform operations with values of the same type BigInt<\/strong>.<\/p>\n\n\n\n<p>Another bad news about BigInt is that you cannot use the object&#039;s methods on a BigInt value. <code><strong>Mathematics<\/strong><\/code>For example, you cannot use <code>Math.sqrt()<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"Math.sqrt(99); \/\/ 9.9498743710662Math.sqrt(99999999999999999n); \/\/ Uncaught TypeError: Cannot convert a BigInt value to a number\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #BABED8\">Mathematics<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">sqrt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">99<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 9.9498743710662<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">Mathematics<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">sqrt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">99999999999999999<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Uncaught TypeError: Cannot convert a BigInt value to a number<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>As a final recommendation, do not complicate your life, do not use BigInt unless the problem you want to solve necessarily requires very large integers.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">BigInt(value) function<\/h3>\n\n\n\n<p>You can convert and create a BigInt with the function <code>BigInt(value)<\/code><\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"BigInt('9999999999'); \/\/ 9999999999n\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #82AAFF\">BigInt<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">9999999999<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 9999999999n<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Boolean<\/h2>\n\n\n\n<p>Boolean is a logical data type, which is represented by only two values. <code><strong>true<\/strong><\/code> and <code><strong>false<\/strong><\/code>. Very useful for making decisions in our programs. Named after the mathematician George Boole. <\/p>\n\n\n\n<p>Boolean type values can be defined as follows. This is the recommended way<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const tieneHijos = true;const esEstudiante = false;\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> tieneHijos <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> esEstudiante <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #89DDFF\">;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>They are widely used in logical operations, for example:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"if (tieneHijos) {  \/\/ Si &quot;si&quot; tiene hijos, preguntar cuantos hijos tiene} else {  \/\/ si &quot;no&quot;}if (esEstudiante) {  \/\/ Si &quot;si&quot; es estuduante, aplicar descuento} else {  \/\/ si &quot;no&quot;}\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (tieneHijos) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">  <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Si &quot;si&quot; tiene hijos, preguntar cuantos hijos tiene<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">  <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ si &quot;no&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (esEstudiante) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">  <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Si &quot;si&quot; es estuduante, aplicar descuento<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">  <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ si &quot;no&quot;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Boolean function(value)<\/h3>\n\n\n\n<p>Booleans also have a function <code>Boolean(value)<\/code>, is suitable for creating booleans and explicitly converting a value to Boolean. More details below in the section <strong><a href=\"#Booleanvalor\">Values that can generate Booleans<\/a>.<\/strong><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">null<\/h2>\n\n\n\n<p>This data type in Javascript is very easy, it is a data that means it is nothing compared to the other data types. In other languages <code>null<\/code> It refers to a pointer or a memory reference that is empty, but in javascript it is different, it is simply a value that means \u201c<strong>nothing&quot;.<\/strong><\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const nada = null;\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> nada <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">null;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">undefined<\/h2>\n\n\n\n<p>This data type represents something that is not yet defined. It is the automatic value of variables, parameters and properties of objects that have not had a value defined.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"let nombre; \/\/ undefinedlet edad; \/\/ undefinednombre === undefined; \/\/ trueedad === undefined; \/\/ true\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">let<\/span><span style=\"color: #BABED8\"> name<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ undefined<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">let<\/span><span style=\"color: #BABED8\"> edad<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ undefined<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">name <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">undefined;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">edad <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">undefined;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">symbol<\/h2>\n\n\n\n<p>This type of data is primarily used to ensure that its value is unique and immutable. It can be used as object properties to reduce access to those properties and thus avoid unwanted modifications. When we look at the objects in more detail we will see their use in practice.<\/p>\n\n\n\n<p>To create this type of primitive data the function is used <code>Symbol()<\/code>. It is the only way to create a <code>symbols<\/code> and it is the recommended one.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const nombre = Symbol('Jaime');const nombreIgual = Symbol('Jaime');nombre === nombreIgual; \/\/ false\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> nombreIgual <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">name <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> nombreIgual<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">String or string of characters<\/h2>\n\n\n\n<p>Strings allow us to save information in text form. They are a sequence of one or more 16-bit, UTF-16 characters. There is no `char` type like in other languages, if you want a character, you simply create a string with a single character. Simple right?<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">We have three ways to create a string.<\/h3>\n\n\n\n<p>Actually you can also create strings with the function <code>String(value)<\/code> or in constructor form <code>new String(value)<\/code>, but let&#039;s not complicate our existence and only use the three below for simplicity:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>With single quotes, <code>''<\/code>. Recommended if you do not need to evaluate expressions inside.<\/li>\n\n\n\n<li>Double quotation marks,  <code>\"\"<\/code><\/li>\n\n\n\n<li>backticks, <code>``<\/code> . Recommended if you need to evaluate expressions within.<\/li>\n<\/ol>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const nombre = 'Jaime';const apellidoPaterno = &quot;Cervantes&quot;;const apellidoMaterno = `Velasco`;\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> last name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #C3E88D\">Cervantes<\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> mother&#039;s last name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #C3E88D\">Velasco<\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #89DDFF\">;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>The third way to define <code>Strings<\/code>, allows us to use expressions within the character string, so it is very useful. For example:<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const nombre = 'Jaime';const apellidoPaterno = &quot;Cervantes&quot;;const apellidoMaterno = `Velasco`;const nombreCompleto = `${nombre} ${apellidoPaterno} ${apellidoMaterno}`; \/\/ Jaime Cervantes Velasco\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> last name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #C3E88D\">Cervantes<\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> mother&#039;s last name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #C3E88D\">Velasco<\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> nombreCompleto <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">`${<\/span><span style=\"color: #BABED8\">name<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\"> <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #BABED8\">last name<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\"> <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #BABED8\">mother&#039;s last name<\/span><span style=\"color: #89DDFF\">}`<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Jaime Cervantes Velasco<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Strings are immutable, when you modify or extend a string a new one is actually generated.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Two character strings can be the same<\/h3>\n\n\n\n<p>You can check that two character strings are the same with  <code>===<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"&quot;jaime&quot; === &quot;jaime&quot;; \/\/ true'jaime' === &quot;jaime&quot;; \/\/ true`jaime` === 'jaime'; \/\/ true\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&quot;<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">===<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">James<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Function <code>String(value)<\/code><\/h3>\n\n\n\n<p>To convert a value to a string you can use the function <code>String(value)<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"String(1); \/\/ '1'String(null); \/\/ 'null'String(undefined); \/\/ 'undefined'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;1&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">null<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;null&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;undefined&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">String.length<\/h3>\n\n\n\n<p>The property <code>length<\/code> of a string is used to know the length of a string of characters, you will see over time that this is useful when working with strings of characters.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const nombre = 'Jaime Cervantes Velasco';nombre.length \/\/ 23\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> name <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime Cervantes Velasco<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">name<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">length <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 23<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Objects<\/h2>\n\n\n\n<p>All other data types are&nbsp;<strong>objects<\/strong>, a function is an object. A <strong>object<\/strong> is a collection of pairs <code>name: value<\/code>, similar to PHP&#039;s \u201cassociative arrays\u201d. These pairs of <code>name\/value<\/code> They are called properties, a property is like a variable and can contain any type of value.<\/p>\n\n\n\n<p>Some objects in Javascript:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>object<\/strong><\/li>\n\n\n\n<li><strong>function<\/strong><\/li>\n\n\n\n<li><strong>array<\/strong><\/li>\n\n\n\n<li><strong>date<\/strong><\/li>\n\n\n\n<li><strong>RegExp<\/strong><\/li>\n\n\n\n<li><strong>Mistake<\/strong><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Primitive Wrapping Objects<\/h3>\n\n\n\n<p>Even primitive data types <strong>String, Boolean, Number, BigInt and Symbol<\/strong>&nbsp;has its corresponding representation in Object, called enveloping objects. In fact, Javascript implicitly converts this primitive data to objects in order to occupy useful methods and properties. For example the property <code>length<\/code> of a string of characters.<\/p>\n\n\n\n<p>How were you planning to get the length of a character string? Understanding that a character string is primitive data and has no methods<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"'Jaime Cervantes Velasco'.length; \/\/ 23, el pri\/\/ A groso modo, lo que sucede implictamente al querer obtener lenght:const nuevoString = new String('Jaime Cervantes Velasco');nuevoString.length; \/\/ 23(5).toFixed(2); \/\/ 5.00\/\/ Igual a groso modo pasa algo asi:const numero = new Number(5);numero.toFixed(2); \/\/ 5.00false.toString(); \/\/ 'false'\/\/ Igual a groso modo pasa algo asi:const booleano = new Boolean(false);numero.toString(2); \/\/ false\/\/ Estos dos tipos de datos primitivos no permiten el uso de new(9n).toLocaleString(); \/\/ '9'Symbol('Hi').toString(); \/\/ 'Symbol(Hi)'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime Cervantes Velasco<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">length<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 23, el pri<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ A groso modo, lo que sucede implictamente al querer obtener lenght:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> nuevoString <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime Cervantes Velasco<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">nuevoString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">length<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 23<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toFixed<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">2<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 5.00<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ Igual a groso modo pasa algo asi:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> numero <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">number<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">numero<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toFixed<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">2<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ 5.00<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">false<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toString<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;false&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ Igual a groso modo pasa algo asi:<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> booleano <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">numero<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toString<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">2<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ Estos dos tipos de datos primitivos no permiten el uso de new<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">9<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toLocaleString<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;9&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Hi<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toString<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;Symbol(Hi)&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Although the BigInt and Symbol data types do not allow the use of <code>new<\/code> It does not mean that objects are not created behind, it is clear that javascript wraps them in an object because it allows us to use the methods of the example, <code>toLocaleString<\/code> and <code>toString<\/code>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">How to create an object?<\/h3>\n\n\n\n<p>To create an object you don&#039;t need to create a class, you simply create the object and start using it. The easiest way to create an object is to use the definition called <strong>literal object<\/strong>, where you simply open and close keys <code>{}<\/code>. This is the recommended way.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const vacio = {};const persona = {  nombre: 'Jaime',  apellidos: 'Cervantes Velasco',  edad: 33,  getNombre: function () {    return `${this.nombre} ${this.apellidos}`;  },  hablar: function () {    return `Hola, soy ${this.getNombre()}, tengo ${this.edad} a\u00f1os.`;  }};const frase = persona.hablar();console.log(frase); \/\/ 'Hola soy Jaime Cervantes Velasco, tengo 33 a\u00f1os.'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> vacio <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{};<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> person <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  <\/span><span style=\"color: #F07178\">name<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  <\/span><span style=\"color: #F07178\">apellidos<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Cervantes Velasco<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  <\/span><span style=\"color: #F07178\">edad<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">33<\/span><span style=\"color: #89DDFF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  <\/span><span style=\"color: #82AAFF\">getName<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">()<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">    <\/span><span style=\"color: #89DDFF; font-style: italic\">return<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">`${<\/span><span style=\"color: #89DDFF\">this.<\/span><span style=\"color: #BABED8\">name<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\"> <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #89DDFF\">this.<\/span><span style=\"color: #BABED8\">apellidos<\/span><span style=\"color: #89DDFF\">}`<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #89DDFF\">},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  <\/span><span style=\"color: #82AAFF\">talk<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">()<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">    <\/span><span style=\"color: #89DDFF; font-style: italic\">return<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #C3E88D\">Hola, soy <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #89DDFF\">this.<\/span><span style=\"color: #82AAFF\">getName<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\">, tengo <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #89DDFF\">this.<\/span><span style=\"color: #BABED8\">edad<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\"> a\u00f1os.<\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">};<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> frase <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> person<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">talk<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #BABED8\">(frase)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;Hola soy Jaime Cervantes Velasco, tengo 33 a\u00f1os.&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>In the example we have an object&nbsp;<code>person<\/code>, has several properties of different types, its name is a&nbsp;<strong>String<\/strong>, his age is a&nbsp;<strong>number<\/strong>,&nbsp;<code>getName<\/code>&nbsp;and&nbsp;<code>talk<\/code>&nbsp;are of type&nbsp;<strong>function<\/strong>, functions that are members of an object are called&nbsp;<strong>methods<\/strong>.<\/p>\n\n\n\n<p>Below are examples of objects.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Accessing properties with square brackets, <code>[&#039;key&#039;]<\/code><\/h3>\n\n\n\n<p>In the previous example we saw how to access the method <code>talk()<\/code>, this method is still a property and is of type <code><strong>functions<\/strong><\/code>. But there is another notation to access properties, using square brackets. Very similar to how the elements of an array are accessed.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"persona.edad; \/\/ regresa 33persona['edad']; \/\/ regresa 33\/\/ obtenemos la funci\u00f3nn con corcheteds y la invocamos con parentesisconst frase = persona['hablar']();console.log(frase); \/\/ 'Hola soy Jaime Cervantes Velasco, tengo 29 a\u00f1os.'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #BABED8\">person<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">edad<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ regresa 33<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">persona[<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">edad<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">]<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ regresa 33<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ obtenemos la funci\u00f3nn con corcheteds y la invocamos con parentesis<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> frase <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> persona[<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">talk<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">]()<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #BABED8\">(frase)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;Hola soy Jaime Cervantes Velasco, tengo 29 a\u00f1os.&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">How to create an object <code>functions<\/code>?<\/h3>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"function imprimirPersona(persona) {  console.log(persona.nombre);  console.log(persona.edad);}\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">printPerson<\/span><span style=\"color: #89DDFF\">(<\/span><span style=\"color: #BABED8; font-style: italic\">person<\/span><span style=\"color: #89DDFF\">)<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #BABED8\">person<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">name<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #BABED8\">person<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">edad<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>As the function <code>printPerson<\/code> It is an object, we can add properties to it without any problem.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"imprimirPersona.miPropiedad = 'Mi propiedad de una funcion';console.log(imprimierPersona.miPropiedad); \/\/ 'Mi propiedad de una funcion\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #BABED8\">printPerson<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">miPropiedad <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Mi propiedad de una funcion<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #BABED8\">(imprimierPersona<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">miPropiedad)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;Mi propiedad de una funcion<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">How to create an object <code>array<\/code>?<\/h3>\n\n\n\n<p>The recommended way is to simply create them using square brackets <code>[]<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const vacio = [];const numeros = [1, 2, 3, 4, 5, 6];const animales = ['perro', 'gato', 'caballo'];const conObjetos = [  \t\t{          nombre: 'Jaime',          edad: 33        },        function imprimierPersona(persona) {          console.log(persona);        }\t];\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> vacio <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> []<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> numeros <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> [<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">2<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">3<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">4<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">6<\/span><span style=\"color: #BABED8\">]<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> animales <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> [<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">perro<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">gato<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">caballo<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">]<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> conObjetos <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> [<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">  \t\t<\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">          <\/span><span style=\"color: #F07178\">name<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">          <\/span><span style=\"color: #F07178\">edad<\/span><span style=\"color: #89DDFF\">:<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">33<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">        <\/span><span style=\"color: #89DDFF\">},<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">        <\/span><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">imprimierPersona<\/span><span style=\"color: #89DDFF\">(<\/span><span style=\"color: #BABED8; font-style: italic\">person<\/span><span style=\"color: #89DDFF\">)<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">          <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #BABED8\">person<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">        <\/span><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">\t]<\/span><span style=\"color: #89DDFF\">;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>Since an array is an object, just like a function, you can also add properties to it.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const numeros = [1, 2, 3, 4, 5, 6];numeros.miPropiedad = 'Mi propiedad de un arreglo';console.log(numeros.miPropiedad); \/\/ 'Mi propiedad de un arreglo\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> numeros <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> [<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">2<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">3<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">4<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">6<\/span><span style=\"color: #BABED8\">]<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">numeros<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">miPropiedad <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Mi propiedad de un arreglo<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #BABED8\">(numeros<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">miPropiedad)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;Mi propiedad de un arreglo<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">How to create an object <code>date<\/code>?<\/h3>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const fecha = new Date();console.log(fecha); \/\/ Fri May 28 2021 10:46:27 GMT-0500 (hora de verano central)\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> fecha <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">date<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #BABED8\">(fecha)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Fri May 28 2021 10:46:27 GMT-0500 (hora de verano central)<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>As you can imagine, we can also add properties to the date object because it is an object<\/p>\n\n\n\n<p>For now, I hope this gives you an idea of the importance of objects in Javascript and why it deserves a more extensive explanation in a future publication.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Values that can generate a boolean <code>false<\/code><\/h2>\n\n\n\n<p>There are true values and false values, which when applied to a condition behave like Booleans. This is because Javascript does an implicit type conversion, which can surprise us if we are not careful, so here I leave you the list of values that can return a Boolean <code><strong>false<\/strong><\/code>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>false<\/li>\n\n\n\n<li>null<\/li>\n\n\n\n<li>undefined<\/li>\n\n\n\n<li>0<\/li>\n\n\n\n<li>0n<\/li>\n\n\n\n<li>NaN<\/li>\n\n\n\n<li>&quot;&quot;, &quot;&quot;, &quot; (empty character string)<\/li>\n<\/ul>\n\n\n\n<p>All other values, including objects, in a condition or passed to the function <code>Boolean(value)<\/code> the Boolean returns <code><strong>true<\/strong><\/code>. A string with a space <strong><code>\" \",<\/code><\/strong> came back <strong><code>true<\/code><\/strong>, and a string with value <strong><code>&quot;false&quot;<\/code><\/strong> also returns <strong><code>true<\/code><\/strong>. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Boolean function(value)<\/h3>\n\n\n\n<p>There is a global function to create Boolean values, <code><strong>Boolean(value)<\/strong><\/code>. Where yes <code>worth<\/code> It&#039;s a real one, come back <code>true<\/code>, otherwise it returns <code>false<\/code>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"Boolean(false); \/\/ falseBoolean(null); \/\/ falseBoolean(undefined); \/\/ falseBoolean(0); \/\/ falseBoolean(0n); \/\/ falseBoolean(NaN); \/\/ falseBoolean(''); \/\/ false\/\/ Todos los demas valores van a regresar trueBoolean(' '); \/\/ trueBoolean('false'); \/\/ trueBoolean('jaime cervantes'); \/\/ trueBoolean({}); \/\/ trueBoolean([]); \/\/ true;\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">null<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">0<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">0<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">NaN<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ false<\/span><\/span>\n<span class=\"line\"><span style=\"color: #464B5D; font-style: italic\">\/\/ Todos los demas valores van a regresar true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">false<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">jaime cervantes<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">Boolean<\/span><span style=\"color: #BABED8\">([])<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ true;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Under logical conditions<\/h3>\n\n\n\n<p>Logical conditions in javascript check without a return expression <code>true<\/code> either <code>false<\/code>, they execute an implicit conversion.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"if (false) {} else {  console.log(false);}if (null) {} else {  console.log(false);}if (undefined) {} else {  console.log(false);}if (0) {} else {  console.log(false);}if (0n) {} else {  console.log(false);}if (NaN) {} else {  console.log(false);}if ('') {} else {  console.log(false);}if (' ') {  console.log(true);}if ('false') {  console.log(true);}if ({}) {  console.log(true);}if ([]) {  console.log(true);}\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">null<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #F78C6C\">0<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #F78C6C\">0<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">NaN<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">&#39;&#39;<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF; font-style: italic\">else<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">false<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">false<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> (<\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\">) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF; font-style: italic\">if<\/span><span style=\"color: #BABED8\"> ([]) <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #BABED8\">console<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">log<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Verify types with the operator <code>typeof<\/code><\/h2>\n\n\n\n<p>This operator allows us to identify the type of data we are working with, useful in case we do not know where the information comes from, or we want to process the data based on its type. The operator returns the lowercase name of the data type.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"typeof 5; \/\/ 'numbertypeof NaN; \/\/ 'number'typeof 99999999999999999999999999999999999999999999999n; \/\/ 'bigint'typeof true; \/\/ 'boolean'typeof null; \/\/ 'object', esto es un error que existe desde la primera versi\u00f3n de JStypeof undefined; \/\/ 'undefined'typeof Symbol('simbolo'); \/\/ 'symbol'typeof 'cadena de caracteres'; \/\/ 'string'typeof {}; \/\/ 'object'typeof []; \/\/ 'objecttypeof new Date(); \/\/ 'object'typeof new String('Jaime'); \/\/ Objecttypeof function() {} \/\/ 'function'typeof class A {} \/\/ 'function'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;number<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">NaN;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;number&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">99999999999999999999999999999999999999999999999<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;bigint&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;boolean&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">null;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;object&#39;, esto es un error que existe desde la primera versi\u00f3n de JS<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">undefined;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;undefined&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">simbolo<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;symbol&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">cadena de caracteres<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;string&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{};<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;object&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> []<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;object<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">date<\/span><span style=\"color: #BABED8\">()<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;object&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Object<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #89DDFF\">()<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;function&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">typeof<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #C792EA\">class<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #FFCB6B\">A<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;function&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>There is a known bug in javascript, when the typeof operator is executed on <code>null<\/code>, this one comes back&#039;<code>object&#039;<\/code>. This bug has existed since the first version of Javascript, <a href=\"https:\/\/pensemosweb.com\/en\/introduccion-javascript\/\">Bad things happen when you write code on the run<\/a>.<\/p>\n\n\n\n<p>If all other non-primitive values are objects, when we use the operator <code>typeof<\/code> about them, what type of data will you tell us what they are? Exactly, <code>&#039;object&#039;<\/code>. Just like in the example above when we pass an object literal, an empty array, a date type object and when we use the surrounding objects of primitives like <code>new String(&#039;Jaime&#039;)<\/code>.<\/p>\n\n\n\n<p>Existe una excepci\u00f3n en typeof, cuando el valor es una funci\u00f3n o una clase, regresara <code>functions<\/code>. Recuerda, una funci\u00f3n en javascript, tambi\u00e9n es un objeto.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Check types with the method <code>Object.prototype.toString<\/code><\/h2>\n\n\n\n<p>As we saw, it is somewhat confusing to use the operator <code>typeof<\/code>, I prefer to use a safer method, it is somewhat strange, but since everything in Javascript is an object and the base object from which all data types in javascript start is <code>object<\/code>, with the exception of the primitive data (although these in turn have their object version), then we can do something like the following.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"Object.prototype.toString.call(5); \/\/ '[object Number]'Object.prototype.toString.call(NaN); \/\/ '[object Number]'Object.prototype.toString.call(99999999999999999999999999999999999999999999999n); \/\/ '[object BigInt]'Object.prototype.toString.call(true); \/\/ '[object Boolean]'Object.prototype.toString.call(null); \/\/ '[object Null]',Object.prototype.toString.call(undefined); \/\/ '[object Undefined]'Object.prototype.toString.call(Symbol('simbolo')); \/\/ '[object Symbol]'Object.prototype.toString.call('cadena de caracteres'); \/\/ '[object String]'Object.prototype.toString.call({}); \/\/ '[object Object]'Object.prototype.toString.call([]); \/\/ '[object Array]'Object.prototype.toString.call(new Date()); \/\/ '[object Date]'Object.prototype.toString.call(new String('Jaime')); \/\/ '[object String]'\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">5<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Number]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">NaN<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Number]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">99999999999999999999999999999999999999999999999<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object BigInt]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Boolean]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">null<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Null]&#39;,<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">undefined<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Undefined]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">simbolo<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">))<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Symbol]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">cadena de caracteres<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object String]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">{}<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Object]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">([])<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Array]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">date<\/span><span style=\"color: #BABED8\">())<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Date]&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">String<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">))<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object String]&#39;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>From this method, you can create a function that verifies the data type. <\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"function getTypeOf(valor) {  const texto = Object.prototype.toString.call(valor); \/\/ '[object Number]', '[object Boolean]', etc  const sinPalabraObject = texto.slice(8, -1); \/\/ Number, Boolean, Null, Undefined, Symbol, String, etc.  const tipo = sinPalabraObject.toLowerCase(); \/\/ number, boolean, null, undefined, symbol, string, etc.  return tipo;}getTypeOf(1); \/\/ 'number'getTypeOf(new Date()); \/\/ dategetTypeOf([]); \/\/ array\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">functions<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">getTypeOf<\/span><span style=\"color: #89DDFF\">(<\/span><span style=\"color: #BABED8; font-style: italic\">worth<\/span><span style=\"color: #89DDFF\">)<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #C792EA\">const<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">texto<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #FFCB6B\">object<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">prototype<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #BABED8\">toString<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">call<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #BABED8\">worth<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;[object Number]&#39;, &#39;[object Boolean]&#39;, etc<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #C792EA\">const<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">sinPalabraObject<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">texto<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">slice<\/span><span style=\"color: #F07178\">(<\/span><span style=\"color: #F78C6C\">8<\/span><span style=\"color: #89DDFF\">,<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">-<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #F07178\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ Number, Boolean, Null, Undefined, Symbol, String, etc.<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #C792EA\">const<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">tipo<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">sinPalabraObject<\/span><span style=\"color: #89DDFF\">.<\/span><span style=\"color: #82AAFF\">toLowerCase<\/span><span style=\"color: #F07178\">()<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ number, boolean, null, undefined, symbol, string, etc.<\/span><\/span>\n<span class=\"line\"><span style=\"color: #F07178\">  <\/span><span style=\"color: #89DDFF; font-style: italic\">return<\/span><span style=\"color: #F07178\"> <\/span><span style=\"color: #BABED8\">tipo<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #89DDFF\">}<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">getTypeOf<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #F78C6C\">1<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ &#39;number&#39;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">getTypeOf<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">new<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">date<\/span><span style=\"color: #BABED8\">())<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ date<\/span><\/span>\n<span class=\"line\"><span style=\"color: #82AAFF\">getTypeOf<\/span><span style=\"color: #BABED8\">([])<\/span><span style=\"color: #89DDFF\">;<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #464B5D; font-style: italic\">\/\/ array<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>The special property <strong>prototype<\/strong> is very important in Javascript, if you have read more than one of my publications, you will have noticed that I have mentioned that Javascript is a multiparadigm and object-oriented programming language based on prototypes, in another publication we will explain in detail the functionality of prototypes in Javascript .<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>Everything in Javascript is an object, with the exception of primitive types, but as we already saw, when wanting to use them as objects by invoking some method, that is where javascript wraps them (in practice everything is an object).<\/p>\n\n\n\n<p>Any programming language has good things that we can take advantage of, but it can also have strange and confusing things (compared to most modern programming languages), such as the operator <code>typeof<\/code> and the method <code>Object.prototype.toString<\/code>, the value <code>NaN<\/code>, the values that can generate a boolean <code>false<\/code>, and many other things we didn&#039;t see for simplicity&#039;s sake. It is up to the programmer to take the best parts and eliminate or mitigate those that do not help us communicate better with our work team, always with a focus on simplifying things.<\/p>\n\n\n\n<p>In the case of creating some type of data in Javascript, the simplest and easiest way to use is simply creating the values that we are going to use. As recommended in previous sections, this way of creating them is called <strong>literal<\/strong>.<\/p>\n\n\n\n<div class=\"wp-block-kevinbatdorf-code-block-pro\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\" style=\"font-size:.875rem;font-family:Code-Pro-JetBrains-Mono,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;line-height:1.25rem;--cbp-tab-width:2;tab-size:var(--cbp-tab-width, 2)\"><span style=\"display:block;padding:16px 0 0 16px;margin-bottom:-1px;width:100%;text-align:left;background-color:#0F111A\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"54\" height=\"14\" viewbox=\"0 0 54 14\"><g fill=\"none\" fill-rule=\"evenodd\" transform=\"translate(1 1)\"><circle cx=\"6\" cy=\"6\" r=\"6\" fill=\"#FF5F56\" stroke=\"#E0443E\" stroke-width=\".5\"><\/circle><circle cx=\"26\" cy=\"6\" r=\"6\" fill=\"#FFBD2E\" stroke=\"#DEA123\" stroke-width=\".5\"><\/circle><circle cx=\"46\" cy=\"6\" r=\"6\" fill=\"#27C93F\" stroke=\"#1AAB29\" stroke-width=\".5\"><\/circle><\/g><\/svg><\/span><span role=\"button\" tabindex=\"0\" data-code=\"const numero = 9999.54;const enteroGrande = 99999999999999n;const boleano = true;const nulo = null;let noDefinido;const simbolo = Symbol('identificador');const cadenaDeCaracteres = 'Jaime Cervantes Velasco';const cadenaDeCaractresConExpresion = `El numero ${numero} es &quot;Number&quot;`;const objeto = {};const arreglo = [];\" style=\"color:#babed8;display:none\" aria-label=\"Copy\" class=\"code-block-pro-copy-button\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" style=\"width:24px;height:24px\" fill=\"none\" viewbox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\"><path class=\"with-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4\"><\/path><path class=\"without-check\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2\"><\/path><\/svg><\/span><pre class=\"shiki material-theme-ocean\" style=\"background-color: #0F111A\" tabindex=\"0\"><code><span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> numero <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">9999.54<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> enteroGrande <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #F78C6C\">99999999999999<\/span><span style=\"color: #C792EA\">n<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> boleano <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #FF9CAC\">true<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> nulo <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">null;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">let<\/span><span style=\"color: #BABED8\"> noDefinido<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> simbolo <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #82AAFF\">symbol<\/span><span style=\"color: #BABED8\">(<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">identifier<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #BABED8\">)<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> cadenaDeCaracteres <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #C3E88D\">Jaime Cervantes Velasco<\/span><span style=\"color: #89DDFF\">&#39;<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> cadenaDeCaractresConExpresion <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #C3E88D\">El numero <\/span><span style=\"color: #89DDFF\">${<\/span><span style=\"color: #BABED8\">numero<\/span><span style=\"color: #89DDFF\">}<\/span><span style=\"color: #C3E88D\"> es &quot;Number&quot;<\/span><span style=\"color: #89DDFF\">`<\/span><span style=\"color: #89DDFF\">;<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> object <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> <\/span><span style=\"color: #89DDFF\">{};<\/span><\/span>\n<span class=\"line\"><span style=\"color: #C792EA\">const<\/span><span style=\"color: #BABED8\"> arreglo <\/span><span style=\"color: #89DDFF\">=<\/span><span style=\"color: #BABED8\"> []<\/span><span style=\"color: #89DDFF\">;<\/span><\/span><\/code><\/pre><\/div>\n\n\n\n<p>There are even more details to cover about data types in javascript, but as we go we will see more necessary topics, for now it seems to me that this information is enough.<\/p>","protected":false},"excerpt":{"rendered":"<p>JavaScript es un lenguaje d\u00e9bilmente tipeado, esto quiere decir que no es necesario definir el tipo de dato. Pero tampoco es que no tenga tipos, pues el tipo de dato es definido en tiempo de ejecuci\u00f3n por Javascript, recordemos que Javascript es un lenguaje compilado en el momento.<\/p>","protected":false},"author":2,"featured_media":3723,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[28,30],"tags":[54,78],"class_list":["post-2262","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","category-node-js","tag-javascript","tag-tipos-de-datos"],"_links":{"self":[{"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/posts\/2262","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/comments?post=2262"}],"version-history":[{"count":9,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/posts\/2262\/revisions"}],"predecessor-version":[{"id":3818,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/posts\/2262\/revisions\/3818"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/media\/3723"}],"wp:attachment":[{"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/media?parent=2262"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/categories?post=2262"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pensemosweb.com\/en\/wp-json\/wp\/v2\/tags?post=2262"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}