title: React Js - reaching inner functions with outer variables
body: <p>I got a quick question.
  Is there anyway to have a global variable that reaches the inne functions in this code.
  I other words i don't want to have to repeat the line &quot;const user = JSON.parse(localStorage.getItem(&quot;user&quot;));&quot;</p>
  <p>but rather have a global variable for the user.accessToken</p>
  <pre><code>import axios from &quot;axios&quot;;
  const API_URL = &quot;http://localhost:8081/api/files/&quot;;
  
  const upload = (file, onUploadProgress) =&gt; {
    const user = JSON.parse(localStorage.getItem(&quot;user&quot;));
    let formData = new FormData();
    formData.append(&quot;file&quot;, file);
  
    return axios.post(API_URL + &quot;upload&quot;, formData, {
      headers: {
        &quot;Content-Type&quot;: &quot;multipart/form-data&quot;,
        Authorization: &quot;Bearer &quot; + user.accessToken,
      },
      onUploadProgress,
    });
  };
  
  const getFiles = () =&gt; {
    const user = JSON.parse(localStorage.getItem(&quot;user&quot;));
    return axios.get(API_URL + &quot;getall&quot;, {
      headers: {
        &quot;Content-Type&quot;: &quot;application/json&quot;,
        Authorization: &quot;Bearer &quot; + user.accessToken,
      },
    });
  };
  
  const FileUploadService = {
    upload,
    getFiles,
  };
  
  export default FileUploadService;
  </code></pre>