<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: neemkashu</title>
    <description>The latest articles on DEV Community by neemkashu (@neemkashu).</description>
    <link>https://dev.to/neemkashu</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1068497%2Fe71a33e1-5f9d-414c-926b-20023b6cc380.png</url>
      <title>DEV Community: neemkashu</title>
      <link>https://dev.to/neemkashu</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/neemkashu"/>
    <language>en</language>
    <item>
      <title>Binary Search with Invariants: Easy and Clear Approach</title>
      <dc:creator>neemkashu</dc:creator>
      <pubDate>Fri, 22 Sep 2023 16:03:04 +0000</pubDate>
      <link>https://dev.to/neemkashu/binary-search-with-invariants-easy-and-clear-approach-1k8l</link>
      <guid>https://dev.to/neemkashu/binary-search-with-invariants-easy-and-clear-approach-1k8l</guid>
      <description>&lt;p&gt;Struggling with Binary Search? While the algorithm’s core concept is simple, implementing it without errors can be challenging. This is a guide to a debugging-free approach.&lt;/p&gt;

&lt;p&gt;The core idea is to use &lt;strong&gt;predicates&lt;/strong&gt; and &lt;strong&gt;invariants&lt;/strong&gt;, which we’ll explore in detail.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;NOTE&lt;/strong&gt;: The article assumes that you are &lt;strong&gt;familiar&lt;/strong&gt; with the idea of binary search. The aim is to improve your implementation skills.&lt;/p&gt;

&lt;h2&gt;
  
  
  💡 A couple of concepts
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Invariant&lt;/strong&gt;: some relation that will not change during the entire algorithm&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Binary predicate&lt;/strong&gt;: a function that returns boolean and is used for the search&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  📘 Binary Search Blueprint
&lt;/h2&gt;

&lt;p&gt;The code is in &lt;strong&gt;JavaScript&lt;/strong&gt;, but it looks almost the same in other popular languages, if you can pass a function as an argument. Also, you don’t have to worry about array index out-of-bounds errors: they won’t occur.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
&lt;span class="c1"&gt;// we will replace '?' with correct code&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="c1"&gt;// init left pointer&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="c1"&gt;// init right pointer&lt;/span&gt;

  &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="c1"&gt;// the end of the search&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="c1"&gt;// middle pointer&lt;/span&gt;

    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;m&lt;/span&gt;&lt;span class="p"&gt;]))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="c1"&gt;// adjust pointers for a predicate true value&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="c1"&gt;// and for the false value&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="c1"&gt;// return some number at the end&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;EVERYTHING&lt;/strong&gt; in this prototype can be written without trial and error, without “oh, should it be +1 or -1” or rounding problems.&lt;/p&gt;

&lt;h2&gt;
  
  
  ❓ Problem Statement
&lt;/h2&gt;

&lt;p&gt;Let’s solve the following task&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Given an array of &lt;strong&gt;integers&lt;/strong&gt;, find the index of the &lt;strong&gt;first odd number&lt;/strong&gt; in the array. &lt;strong&gt;All even&lt;/strong&gt; numbers in the array are positioned &lt;strong&gt;to the left&lt;/strong&gt; of the odd numbers.&lt;br&gt;
Example: &lt;code&gt;[2 6 4 5 9 1 1]&lt;/code&gt; Answer: &lt;code&gt;3&lt;/code&gt;&lt;br&gt;
Example: &lt;code&gt;[4 4 4]&lt;/code&gt; Answer: &lt;code&gt;-1&lt;/code&gt; (the index is not found)&lt;br&gt;
Example: &lt;code&gt;[3 7 5]&lt;/code&gt; Answer: &lt;code&gt;0&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;We’ll fill the blueprint’s gaps in the order of reasoning.&lt;/p&gt;

&lt;h2&gt;
  
  
  ➡️Solution Step-by-Step ️➡️
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Predicate ⚖️
&lt;/h3&gt;

&lt;p&gt;We will write a function that changes from &lt;code&gt;false&lt;/code&gt; to &lt;code&gt;true&lt;/code&gt; at the border where the answer is located. Let’s use the following markers:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;false&lt;/code&gt; as &lt;strong&gt;minus&lt;/strong&gt;, &lt;code&gt;-&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;true&lt;/code&gt; as &lt;strong&gt;plus&lt;/strong&gt;, &lt;code&gt;+&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The predicate indicates we are to the left or to the right of the desired value.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;  &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt;
&lt;span class="p"&gt;[&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="mi"&gt;6&lt;/span&gt; &lt;span class="mi"&gt;4&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt; &lt;span class="mi"&gt;9&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="p"&gt;]&lt;/span&gt;

&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;predicate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;%&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;

&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt;
&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;4&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;===&lt;/span&gt; &lt;span class="kc"&gt;false&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Also, be sure that the predicate value changes &lt;strong&gt;at most once&lt;/strong&gt; amoung the array values. Consider the possible predicate values for an arbitrary array:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;[ - - - - - + + ]
[ - - - - - - - ]
[ + + + + + + + ]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;
  Note 1: &lt;em&gt;Find the last even number&lt;/em&gt;
  &lt;p&gt;You may want to choose a predicate that changes from &lt;code&gt;true&lt;/code&gt; to &lt;code&gt;false&lt;/code&gt; at some index, for example, if the task is to find &lt;strong&gt;the last even number&lt;/strong&gt;. But you don’t have to: just choose what to return either &lt;code&gt;l&lt;/code&gt; or &lt;code&gt;r&lt;/code&gt;, as we’ll see later.&lt;/p&gt;

&lt;br&gt;

  Note 2: &lt;em&gt;Why bother with a predicate?&lt;/em&gt;
  &lt;p&gt;That makes the implementation &lt;strong&gt;independent&lt;/strong&gt; of the specific problem or task. Find a few other examples of a predicate in the &lt;strong&gt;Examples&lt;/strong&gt; section of the article.&lt;/p&gt;

&lt;/p&gt;

&lt;h3&gt;
  
  
  Invariants 🔒
&lt;/h3&gt;

&lt;p&gt;You need to choose statements about the left and right boundaries (&lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt;) that you will &lt;strong&gt;keep true&lt;/strong&gt; during the entire algorithm. Let’s say these statements are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;l&lt;/code&gt; points to minus&lt;/li&gt;
&lt;li&gt;only minuses are to the left of &lt;code&gt;l&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;r&lt;/code&gt; points to plus&lt;/li&gt;
&lt;li&gt;only pluses are to the right of &lt;code&gt;r&lt;/code&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;In markdown illustration&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;l points to minuses only
  l     l
[ - - - - + + + + + ]

r points to pluses only
          r       r
[ - - - - + + + + + ]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Initial values 🌱
&lt;/h3&gt;

&lt;p&gt;Let’s introduce a small &lt;strong&gt;convention&lt;/strong&gt;. Let the predicate give a minus to the left of the array, and a plus to the right of the array. These checks will never be run in the code, but they will help to immediately place &lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -               + + +
     [2 6 4 5 9 1 1]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;So, place &lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt; to satisfy the invariants:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;l&lt;/code&gt; points to “index” &lt;code&gt;–1&lt;/code&gt;: we are sure that only minuses are to the left of index &lt;code&gt;0&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;r&lt;/code&gt; points to the right of the last index: the only known plus &lt;code&gt;+&lt;/code&gt; at the initial state
&lt;/li&gt;
&lt;/ul&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -               + + +
     [2 6 4 5 9 1 1]
    l               r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Thus, the initial values are ready.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;

&lt;span class="c1"&gt;// the rest of the code&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Loop test condition 🔄
&lt;/h3&gt;

&lt;p&gt;The invariant gives a clue when to exit the loop. Illustrate the closest possible positions of l and r still satisfing the invariant.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;l rightmost position

        l
[ - - - - + + + + + ] 
          r

r leftmost position
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;That’s it! End the loop when &lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt; are neighbors.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;  &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="c1"&gt;// code&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Predicate returns true ✅
&lt;/h3&gt;

&lt;p&gt;We somehow calculated the middle &lt;code&gt;m&lt;/code&gt; (about it later) and perform a check &lt;code&gt;predicate(arr[m])&lt;/code&gt;. Consider the result which equals plus &lt;code&gt;+&lt;/code&gt; , or &lt;code&gt;true&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -       m        + + +
     [      +       ]
    l                r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The target is somewhere between &lt;code&gt;-&lt;/code&gt; and &lt;code&gt;+&lt;/code&gt; so we will change the right pointer. Keep the invariant true: &lt;code&gt;r&lt;/code&gt; points to plus &lt;code&gt;+&lt;/code&gt; and only pluses are to the right.&lt;/p&gt;

&lt;p&gt;Code update:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;m&lt;/span&gt;&lt;span class="p"&gt;]))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;r&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Predicate returns false ❌
&lt;/h3&gt;

&lt;p&gt;If the result of &lt;code&gt;predicate(arr[m])&lt;/code&gt; equals minus &lt;code&gt;-&lt;/code&gt; , or &lt;code&gt;false&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -       m        + + +
     [      -       ]
    l                r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;we will change the &lt;strong&gt;left&lt;/strong&gt; pointer. The invariant: &lt;code&gt;l&lt;/code&gt; points to minus and only minuses are to the left of &lt;code&gt;l&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -       m        + + +
     [- - - -       ]
            l        r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Code update:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// ...&lt;/span&gt;
      &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  What is &lt;code&gt;m&lt;/code&gt; equal to? ➗
&lt;/h3&gt;

&lt;p&gt;&lt;code&gt;m&lt;/code&gt; is the middle between &lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt; but we have to round it up or down.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;m = Math.floor((l + r) / 2)

           vs

m = Math.ceil((l + r) / 2)
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Here comes the reason why our invariant is the best: the rounding does not matter. Consider such a situation: &lt;code&gt;l&lt;/code&gt; и &lt;code&gt;r&lt;/code&gt; are one iteration from the end of the loop. Despite of rounding, &lt;code&gt;m&lt;/code&gt; points right between &lt;code&gt;l&lt;/code&gt; and &lt;code&gt;r&lt;/code&gt; so the next iteration ends the loop.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;- - -         m          + + +      - - -         m        + + +
     [- - - - - + + + + ]       ---&amp;gt;     [- - - - - + + + ]
            l   r                                 l r

- - -         m          + + +      - - -         m        + + +
     [- - - - + + + + + ]       ---&amp;gt;     [- - - - + + + + ]
            l   r                               l r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Also, you automatically avoid the problem of an infinite loop.&lt;/p&gt;

&lt;h2&gt;
  
  
  🚀 Binary Search Code
&lt;/h2&gt;

&lt;p&gt;The loop ends when &lt;code&gt;l&lt;/code&gt; points to the last minus and &lt;code&gt;r&lt;/code&gt; points to the first plus. The task is to find the first odd number so it is preferable to return &lt;code&gt;r&lt;/code&gt; in our case.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;

  &lt;span class="k"&gt;while&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
    &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nb"&gt;Math&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;floor&lt;/span&gt;&lt;span class="p"&gt;((&lt;/span&gt;&lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;/&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

    &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;m&lt;/span&gt;&lt;span class="p"&gt;]))&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;r&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt; &lt;span class="k"&gt;else&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
      &lt;span class="nx"&gt;l&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;m&lt;/span&gt;
    &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="p"&gt;}&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;r&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Edge Cases and Problem Solution ⚠️
&lt;/h3&gt;

&lt;p&gt;Remember the second test case of the task&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Example: &lt;code&gt;[4 4 4]&lt;/code&gt; Answer: &lt;code&gt;-1&lt;/code&gt; (the index is not found)&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;In this case, our binary search returns &lt;code&gt;3&lt;/code&gt;, and that’s intentional. Do not include task details into binary search code, just handle the results in the solution.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;solution&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;predicate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;%&lt;/span&gt; &lt;span class="mi"&gt;2&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;firstOdd&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;firstOdd&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="nx"&gt;firstOdd&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Next, let’s explore why we don't get the &lt;strong&gt;out-of-bounds error&lt;/strong&gt;. You access the array’s elements only through index &lt;code&gt;m&lt;/code&gt;. The following relations ensure that &lt;code&gt;m&lt;/code&gt; is always greater than &lt;code&gt;l&lt;/code&gt; and is less than &lt;code&gt;r&lt;/code&gt;. Thus, &lt;code&gt;m&lt;/code&gt; never equals &lt;code&gt;-1&lt;/code&gt; or an array length&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;m = Math.floor((l + r) / 2)
l + 1 &amp;lt; r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Examine how &lt;code&gt;m&lt;/code&gt; changes during the search in this array.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Example: &lt;code&gt;[4 4 4 6 8 8]&lt;/code&gt;&lt;br&gt;
&lt;/p&gt;
&lt;/blockquote&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;m = 2
-     m       +
 [4 4 4 6 8 8]
l             r

m = 4
- - - -   m   +
 [4 4 4 6 8 8]
      l       r

m = 5
- - - - - - m +
 [4 4 4 6 8 8]
          l   r

end of the loop
- - - - - - - +
 [4 4 4 6 8 8]
            l r
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;You can obtain a similar result when considering &lt;code&gt;[1 3 5 7 9]&lt;/code&gt;: the minimum value of &lt;code&gt;m&lt;/code&gt; is &lt;code&gt;0&lt;/code&gt; just before the end of the search.&lt;/p&gt;

&lt;h2&gt;
  
  
  📝 Examples
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Task 1
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;An array of integers is sorted in a &lt;strong&gt;non-decreasing&lt;/strong&gt; order. Find the index of an &lt;strong&gt;arbitrary target&lt;/strong&gt; integer. If the array includes several numbers equal to the target return the index of the first one.&lt;/p&gt;

&lt;p&gt;Example: &lt;code&gt;9&lt;/code&gt;, &lt;code&gt;[-1 0 1 5 7]&lt;/code&gt; Answer: &lt;code&gt;-1&lt;/code&gt; (the index is not found)&lt;br&gt;
Example: &lt;code&gt;2&lt;/code&gt;, &lt;code&gt;[4 4 4]&lt;/code&gt; Answer: &lt;code&gt;-1&lt;/code&gt; (the index is not found)&lt;br&gt;
Example: &lt;code&gt;8&lt;/code&gt;, &lt;code&gt;[-3 5 8 8 8 9]&lt;/code&gt; Answer: &lt;code&gt;2&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;strong&gt;Solution&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Firstly, write the &lt;strong&gt;predicate&lt;/strong&gt;: check that it returns only pluses, only minuses or changes once at the edge&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const predicate = (num) =&amp;gt; num &amp;gt;= target

Target: 9
  - - - - -
[-1 0 1 5 7]

Target: 2
 + + +
[4 4 4]

Target: 8
  - - + + + +
[-3 5 8 8 8 9]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then, apply the binary search as a ready function and handle the results of the search&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;solution&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;target&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;

  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;predicate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt; &lt;span class="nx"&gt;target&lt;/span&gt;
&lt;span class="c1"&gt;// index of greater or equal to target&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;geTarget&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

  &lt;span class="k"&gt;if&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;geTarget&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;length&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt;
  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="nx"&gt;geTarget&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;!==&lt;/span&gt; &lt;span class="nx"&gt;target&lt;/span&gt; &lt;span class="p"&gt;?&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt;&lt;span class="mi"&gt;1&lt;/span&gt; &lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nx"&gt;geTarget&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h3&gt;
  
  
  Task 2
&lt;/h3&gt;

&lt;blockquote&gt;
&lt;p&gt;Given an array of integers sorted in a non-decreasing order find the index of the &lt;strong&gt;last negative&lt;/strong&gt; number.&lt;br&gt;
Example: &lt;code&gt;[-3 0 1 5 7]&lt;/code&gt; Answer: &lt;code&gt;0&lt;/code&gt;&lt;br&gt;
Example: &lt;code&gt;[4 4 4]&lt;/code&gt; Answer: &lt;code&gt;-1&lt;/code&gt; (the index is not found)&lt;br&gt;
Example: &lt;code&gt;[-9 -8 -1]&lt;/code&gt; Answer: &lt;code&gt;2&lt;/code&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;strong&gt;Solution&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Write the predicate and let the binary search find the first non-negative number.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;const predicate = (num) =&amp;gt; num &amp;gt;= 0

  - + + + +
[-3 0 1 5 7]

 + + +
[4 4 4]

  -  -  -
[-9 -8 -1]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Then handle the result in the solution.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nx"&gt;solution&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;predicate&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;num&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;num&lt;/span&gt; &lt;span class="o"&gt;&amp;gt;=&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;lastNonNegative&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="nx"&gt;binarySearch&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;predicate&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt;

  &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;lastNonNegative&lt;/span&gt; &lt;span class="o"&gt;-&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  🎉 Conclusion
&lt;/h2&gt;

&lt;p&gt;Implement binary search function by these steps:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;write a &lt;strong&gt;predicate&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;choose &lt;strong&gt;invariants&lt;/strong&gt; for left and right pointers (you know which are the best)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;rely on&lt;/strong&gt; invariants to &lt;strong&gt;init&lt;/strong&gt; the pointers&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;rely on&lt;/strong&gt; invariants to write the &lt;strong&gt;loop exit&lt;/strong&gt; condition&lt;/li&gt;
&lt;li&gt;find the &lt;strong&gt;middle&lt;/strong&gt;
&lt;/li&gt;
&lt;li&gt;find the predicate value at the middle and change one of the pointers&lt;/li&gt;
&lt;li&gt;return one of the pointers from the function&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;After a bit of practice binary search will become a reliable tool in your hands.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Happy coding!&lt;/em&gt;&lt;/p&gt;

</description>
      <category>algorithms</category>
      <category>beginners</category>
      <category>javascript</category>
      <category>binarysearch</category>
    </item>
  </channel>
</rss>
