title: How to return null instead of undefined when using arr.map(elem => dict[elem]) in typescript?
body: <p>I wrote a simple function to replace values in an array according to a look-up dictionary object:</p>
  <pre class="lang-js prettyprint-override"><code>// typescript
  function recode(arr: any[], dict: Record&lt;string, string&gt; ) {
      return arr.map(el =&gt; dict[el])
  }
  </code></pre>
  <p>It works as expected. However, I want the function to return <code>null</code> when array values have no match in the look-up dictionary.</p>
  <p>So right now if I do:</p>
  <pre class="lang-js prettyprint-override"><code>// array input
  const myArr: string[] = ['eggplant', 'tomato', 'carrot', 'cabbage'];
  
  // look-up dictionary
  const myDictionary: Record&lt;string, string&gt; = {
      eggplant: 'purple',
      tomato: 'red',
      carrot: 'orange'
  };
  
  function recode(arr: any[], dict: Record&lt;string, string&gt; ) {
      return arr.map(el =&gt; dict[el])
  }
  
  // calling recode()
  recode(myArr, myDictionary) 
  // returns 
  // [&quot;purple&quot;, &quot;red&quot;, &quot;orange&quot;, undefined] 
  </code></pre>
  <p>But I want the output to be</p>
  <pre class="lang-js prettyprint-override"><code>// [&quot;purple&quot;, &quot;red&quot;, &quot;orange&quot;, null] 
  </code></pre>
  <p>Is there a simple enough way to achieve this, considering that I'm using <em>typescript</em> (not sure it makes a difference)?</p>
  <p><a href="https://www.typescriptlang.org/play?#code/MYewdgzgLgBAtgTwIICcUC4bRQSzAcwG0BdGAXhkIHIBTffABwBsBDMKKgGhiqhDhZ8uPYCzQgO3KqIBGMlvhpViAbgBQa0JFiIAIjmBQc4MQkwAlGqBQATADzY8%20bo4IA%20cjADeagJB1GVnZMKgYAVxRmJU4-PgE%20EJQaGy4-UXEoEJAUNkUqNQBfdTUAMzCwQ2MwGCTQGxoACjEMGDYEEm4bA0yYS2t7V2csKFx3GABKbzUYGZqaKAjq5oA6AQYGmiZyDy7DQk3iccKNWpB6hsRUFG49bqrTcaA" rel="nofollow noreferrer">Typescript REPL</a></p>