{"id":266,"date":"2025-12-10T08:41:10","date_gmt":"2025-12-10T08:41:10","guid":{"rendered":"https:\/\/cybexpte.com\/?p=266"},"modified":"2025-12-10T10:20:54","modified_gmt":"2025-12-10T10:20:54","slug":"lesson-1-encoding","status":"publish","type":"post","link":"https:\/\/cybexpte.com\/index.php\/2025\/12\/10\/lesson-1-encoding\/","title":{"rendered":"Lesson 1: Encoding"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Introduction<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Their are multiple ways in which you can represent numbers in different systems like binary, hexadecimal, or even Base64? Base conversion is a basic concept in programming, allowing us to represent the same number in multiple ways using different \u201c<strong>alphabets<\/strong>\u201d of characters.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">In this post, we\u2019ll explore a small JavaScript function that converts a number from one base to another using a custom set of characters in which it will also help you understand the logic behind base encoding and how you can implement it yourself.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>The Function I Have Studied<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">function basenencode(decoded, baseTo, baseForm = 10) {<br> const Base64String    =&#8217;0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+\/&#8217;;<br> let encoded = &#8220;&#8221;;<br>while (decoded &gt; 0){<br>       let reminder = decoded % baseTo;<br>              console.log (reminder);<br>       let c = Base64String[reminder];<br>              console.log(c);<br>encoded = encoded + c;<br>decoded = Math.floor (decoded \/ baseTo);<br>}<br>   console.log (encoded);<br>    return encoded;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">};<br>basenencode (45, 25);<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">What I have Learnt <\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">1.   For finding a reminder we have to use the modulo. Modulo finds the\u00a0<strong>remainder<\/strong>\u00a0after dividing one integer by another which normally uses %<br><em>For Example<\/em>:<br>                                 <strong>X % Y = reminder<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Similar to the below code:<br><br><strong><em>         let reminder = decoded % baseTo;<br> console.log (reminder);<\/em><\/strong><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><em>=&#8217;0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+\/&#8217;;<\/em><\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">2.  The above code is a string which is the \u201calphabet\u201d that the function uses to represent numbers when converting them to a different base.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">It is arranged in digits + uppercase letters + lowercase letters + <code>+\/<\/code>. It has normally 64 characters <\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br>For Example:<br><code>'0'<\/code> \u2192 0,     <code>'1'<\/code> \u2192 1,      <code>'A'<\/code> \u2192 10,     <code>'a'<\/code> \u2192 36,     <code>'+'<\/code> \u2192 62,    <code>'\/'<\/code> \u2192 63<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">However, in your string, <strong>digits <code>0\u20139<\/code> are repeated<\/strong>, which is unnecessary and could cause confusion for bases greater than 36.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><em>For Example<\/em>:<br>If your remainder is <code>20<\/code>, the character at index 20 in the string is <code>'K'<\/code>. In which that character will represent it&#8217;s number 20 in your encoded result.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<p class=\"wp-block-paragraph\">3.   If you want to Joint a String then just use a + sign. The + sign is used in JS whereas . (dot) is used in PHP for joining String.<br><br><em>For Example:<\/em><br><br>JS &#8211; S1 + S2<br><br>PHP &#8211; S1 . S2<br><br><strong>Same As Below Function:<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><br><em><strong>encoded = encoded + c;<\/strong><\/em><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><em>decoded = Math.floor (decoded \/ baseTo);<\/em><\/strong><br><br>4.  The above function  updates the number by dividing it by the target base and rounding down. This is part of converting a number to a new base: we take the remainder to get a digit, then reduce the number for the next step. The process repeats until the number becomes zero.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p class=\"wp-block-paragraph\"><strong><code>let<\/code><\/strong>  declares a variable that can be <strong>changed later<\/strong>. Unlike <code>const<\/code>, you can assign a new value to it.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>String <\/strong>a pattern of characters, like letters, numbers, or symbols, used to represent text.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Integer<\/strong> is a whole number, <strong>a number without any decimal or fractional part<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Array<\/strong> is a collection of values stored in a single variable. Can store numbers, strings, or even other arrays.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Summer<\/strong>y<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Numbers can be represented in different systems like binary, hexadecimal, or Base64. The <code>basenencode<\/code> function in JavaScript converts a number to a different base using a custom set of characters. It works by finding remainders with <code>%<\/code>, mapping them to characters in a string, and reducing the number with <code>Math.floor<\/code> until it becomes zero. This helps us understand how numbers can be encoded in different bases using <strong>strings<\/strong>, <strong>integers<\/strong>, <strong>arrays<\/strong>, and <strong>variables<\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction Their are multiple ways in which you can represent numbers in different systems like binary, hexadecimal, or even Base64? Base conversion is a basic concept in programming, allowing us to represent the same number in multiple ways using different \u201calphabets\u201d of characters. In this post, we\u2019ll explore a small JavaScript function that converts a [&hellip;]<\/p>\n","protected":false},"author":15,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-266","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/posts\/266","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/users\/15"}],"replies":[{"embeddable":true,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/comments?post=266"}],"version-history":[{"count":20,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/posts\/266\/revisions"}],"predecessor-version":[{"id":293,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/posts\/266\/revisions\/293"}],"wp:attachment":[{"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/media?parent=266"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/categories?post=266"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cybexpte.com\/index.php\/wp-json\/wp\/v2\/tags?post=266"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}