title: How to substr item in array
body: <p>Hi all I have following code: <a href="https://codesandbox.io/s/busy-aryabhata-5hzbl" rel="nofollow noreferrer">my code</a></p>
  <p>In this scenario I am receiving some data from backend</p>
  <pre class="lang-js prettyprint-override"><code>const fileName = 
    [ { id: 1, title: 'Armenia lorem ipsum 15 - Oct 30.pdf' } 
    , { id: 2, title: 'France lorem ipsum 16 - Nov 30.pdf'  } 
    , { id: 3, title: 'German lorem ipsum 17 - Dec 30.pdf'  } 
    , { id: 4, title: 'English lorem ipsum 18 - Jan 08.pdf' } 
    ] 
  </code></pre>
  <p>I am counting if all titles chars sum is greater than 40 then I am hiding rest elements(in my case titles) and showing with numbers. That part works very good.</p>
  <pre class="lang-js prettyprint-override"><code>let lengthCount = 0;
  let maxIndex = 0;
  const allowCharCount = 40;
  const file = [];
  const File = ({ data }) =&gt; {
    data.map((item, index) =&gt; {
      if (lengthCount &lt;= allowCharCount) {
        maxIndex = index;
        file.push(item);
      }
      lengthCount = lengthCount + item.title.length;
    });
  
    let myFiles = file.map((perFile) =&gt; (
      &lt;span key={perFile.id} className=&quot;skillItem&quot;&gt;
        {perFile.title}
      &lt;/span&gt;
    ));
  
    return (
      &lt;div className=&quot;skillWrapper&quot;&gt;
        &lt;div&gt;{myFiles}&lt;/div&gt;
        {lengthCount &lt; 20 ? null : (
          &lt;div className=&quot;skillNumber&quot;&gt;+{data.length - maxIndex - 1}&lt;/div&gt;
        )}
      &lt;/div&gt;
    );
  </code></pre>
  <p>Now I am trying to get each elements title and transform them in this way: I need to get 5 chars from beginning then concatenate &quot;...&quot; and then concatenate 10 chars from the end.</p>
  <p>I try to substr my title from the beginning and from the end but it not working</p>
  <blockquote>
  <p>&quot;TypeError: titleFullName.substr is not a function&quot;</p>
  </blockquote>
  <p>here what I try:</p>
  <pre class="lang-js prettyprint-override"><code>let titleFullName = file.map((item) =&gt; item.title);
  let titleFullNameFirstPart = titleFullName.slice(0, 5);
  const titleFullNameSecondPart = titleFullName.slice(10,titleFullName.length - 1);
  const TitleName = titleFullNameFirstPart + &quot;...&quot; + titleFullNameSecondPart;
  </code></pre>
  <p>In the end, for each title I should get something like this, for example :</p>
  <pre><code>Armen... Oct 30.pdf
  Franc... Nov 30.pdf
  Germa... Dec 30.pdf
  Engli... Jan 08.pdf
  </code></pre>