{"id":265,"date":"2020-01-11T18:30:00","date_gmt":"2020-01-11T18:30:00","guid":{"rendered":"https:\/\/www.samarthya.me\/wps\/?p=265"},"modified":"2020-01-12T07:02:14","modified_gmt":"2020-01-12T07:02:14","slug":"handshake-js","status":"publish","type":"post","link":"https:\/\/blog.samarthya.me\/wps\/2020\/01\/11\/handshake-js\/","title":{"rendered":"Handshake: JS"},"content":{"rendered":"<h1>Secret Handshake<\/h1>\n<p>Objective was relatively simple.<\/p>\n<ul>\n<li>A numeral will be provided as input.<\/li>\n<li>Based on the binary equivalent, one needs to compute the secret handshake.<\/li>\n<\/ul>\n<p>Rule for handshake.<\/p>\n<blockquote>\n<pre class=\" language-text\"><code class=\" language-text\">1 = wink\n10 = double blink\n100 = close your eyes\n1000 = jump\n10000 = Reverse the order of the operations in the secret handshake.\n<\/code><\/pre>\n<\/blockquote>\n\n\n<h2 class=\"wp-block-heading\">Example<\/h2>\n\n\n\n<p>Let&#8217;s say the input is 2 the output should be [&#8220;double blink&#8221;].<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Version 1.0<\/h2>\n\n\n\n<pre class=\"wp-block-preformatted\">function binaryOptimized(number) {         \n     var binaryRep = [];                 \n     do {            \n         binaryRep.push(parseInt(number%2));             \n         number \/= 2;          \n    } while (parseInt(number) &gt; 0);               \n    return binaryRep;                     \n}\n\nfunction getCommand(pseudo, arr) {       switch(pseudo) {                  \ncase 1:   arr.push (\"wink\");  break;               \ncase 10:  arr.push (\"double blink\"); break;            \ncase 100:  arr.push (\"close your eyes\"); break;           \ncase 1000:  arr.push (\"jump\");   break;            \ncase 10000:  arr = arr.reverse();         \n}                        \nreturn arr;                      \n} \n                              \nexport const commands = (input) =&gt; {       \n    var rep = binaryOptimized(input);         \n    var commands = [];            \n    rep.map((element, i) =&gt; {            \n           getCommand(element * Math.pow(10, i), commands)              \n    });               \n    return commands;               \n};<\/pre>\n\n\n\n<p>The code is self explanatory<\/p>\n\n\n\n<p>Defined a binary calculation function, computed the equivalent binary representation. Used the individual element to compute the corresponding command and responded back with the response.<\/p>\n\n\n\n<h2 class=\"has-text-align-left wp-block-heading\">Can it be optimized?<\/h2>\n\n\n\n<p class=\"has-text-align-left\">The think I misinterpreted was that, binary calculation of number is an optional thing.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">BITWISE Operator<\/h3>\n\n\n\n<p>There are two basic bitwise operation &#8216;&amp;&#8217; and &#8216;|&#8217;. <\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>Bitwise operators treat their operands as a sequence of 32 bits (zeroes and ones), rather than as decimal, hexadecimal, or octal numbers.<\/p><\/blockquote>\n\n\n\n<h4 class=\"wp-block-heading\">Example<\/h4>\n\n\n\n<pre class=\"wp-block-preformatted\">5 =&gt; 101\nWe can check the bits now\n2^0 = 1 =&gt; 1\n2^1 = 2 =&gt; 10\n2^2 = 4 =&gt; 100\n2^3 = 8 =&gt; 1000\n2^4 = 16 =&gt; 10000\n2^5 = 32 =&gt; 100000<\/pre>\n\n\n\n<p>Now instead of converting it to binary I can simply &amp; to compute the on bits.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">5&amp;1  = 101 &amp; 1 =&gt; 1\n5&amp;2 = 101 &amp; 10 =&gt; 0\n5&amp;4 = 101 &amp; 100 =&gt; 4 \n5&amp;8 = 101 &amp; 1000 =&gt; 0\n5&amp;16 = 101 &amp; 10000 =&gt; 0\n5&amp;32 = 101 &amp; 100000 =&gt; 0<\/pre>\n\n\n\n<p>Also you can define the left shift to compute the bit rep.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">1&lt;&lt;0 = 1\n1&lt;&lt;1 = 10 = 2\n1&lt;&lt;2 = 100 = 4\n1&lt;&lt;3 = 1000 = 8\n1&lt;&lt;4 = 10000 = 16\n1&lt;&lt;5 = 100000 = 32<\/pre>\n\n\n\n<p>So to compute the secret handshake it is just matter of computing the on bits and add it to the final array.<\/p>\n\n\n\n<p>I defined the Array of handshakes <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">HANDSHAKES = [\"wink\", \"double blink\", \"close your eyes\", \"jump\"];<\/pre>\n\n\n\n<p>To compute the handshake sequence I just to validate the ON bits.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Array.filter<\/h3>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>let newArray = arr.filter(callback(element[, index[, array]])[, thisArg])<\/p><\/blockquote>\n\n\n\n<p>Documentation is available <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/filter\">here<\/a>.<\/p>\n\n\n\n<p>Now utilizing the left shift operator, and bitwise &amp; it was easy to compute the final array of handshakes.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">HANDSHAKES.filter( (signal, index) =&gt; n &amp; (1 &lt;&lt; index));<\/pre>\n\n\n\n<p>Where n is the input number from user.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Illustration<\/h3>\n\n\n\n<p>If n = 3 then,<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">HANDSHAKES.filter() will Execute from 0..3\n\n3 = (11)<code>BASE2<\/code>\n\nNow, \n\n[], 0 =&gt; 3&amp;1, [\"wink\"]\n[], 1 =&gt; 3&amp;2, [\"wink\", \"double blink\"]\n[], 2 =&gt; 3&amp;4, [\"wink\", \"double blink\"]\n[], 3 =&gt; 3&amp;8, [\"wink\", \"double blink\"]\n<\/pre>\n\n\n\n<p>For the last condition to reverse we can employ<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">if (n &amp; (1 &lt;&lt; HANDSHAKES.length)) {\n    result.reverse();\n}<\/pre>\n\n\n\n<p>For n = 3, above condition evaluates false so the final result comes out as <\/p>\n\n\n\n<p>[&#8220;wink&#8221;, &#8220;double blink&#8221;]<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">const HANDSHAKES = [\"wink\", \"double blink\", \"close your eyes\", \"jump\"];\n\nexport const commands = (n) => {\n  if (typeof n !== \"number\") {\n    throw new Error(\"Handshake must be a number\");\n  }  \n  const result = HANDSHAKES.filter((signal, index) => n &amp; (1 &lt;&lt; index));\n\n  if (n &amp; (1 &lt;&lt; HANDSHAKES.length)) {\n    result.reverse();\n  }\n\n  return result;\n};<\/pre>\n\n\n\n<p><\/p>\n\n\n\n<p class=\"has-text-align-center\">&#8212; THE &#8211; END &#8212;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Secret Handshake Objective was relatively simple. A numeral will be provided as input. Based on the binary equivalent, one needs to compute the secret handshake. Rule for handshake. 1 = wink 10 = double blink 100 = close your eyes 1000 = jump 10000 = Reverse the order of the operations in the secret handshake. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":266,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[3],"tags":[29,31,19,30],"class_list":["post-265","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-personal","tag-bitwise","tag-exercism","tag-js","tag-optimisation"],"_links":{"self":[{"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/posts\/265","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/comments?post=265"}],"version-history":[{"count":0,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/posts\/265\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/media\/266"}],"wp:attachment":[{"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/media?parent=265"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/categories?post=265"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.samarthya.me\/wps\/wp-json\/wp\/v2\/tags?post=265"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}