title: How to call function with key value pair written in return block?
body: <p>Inspired from angular service method declaration, I am using plain javascript file and write function in the below way (I don't know what this approach is called)</p>
  <h3>test.js</h3>
  <pre><code>var MyService = function() {
          var base;
  
          var service = {
              init: function (formdata) {
                  base.name = formdata.name;
                  console.log('calling init');
              },
              other: function () {
                 console.log('caling other');
              }
          }
          return service;
  }
  </code></pre>
  <p>Now in HTML I want to call it like <code>MyService.init(formdata);</code></p>
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;Scratchpad&lt;/title&gt;
      &lt;script src=&quot;test.js&quot;&gt;&lt;/script&gt;
      &lt;script&gt;
      var formdata = {};
      function generateData() {
          var form = document.getElementById('Myform');
          formdata.name = 'Alpha';
          console.log(formdata);
          MyService.init(formdata);
      }
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;form id=&quot;Myform&quot; role=&quot;form&quot; method=&quot;post&quot;&gt;
    &lt;button type=&quot;button&quot; onclick=&quot;generateData()&quot;&gt;Generate Data&lt;/button&gt;
  &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>but it produces the following error</p>
  <p><strong>uncaught ReferenceError: MyService is not defined</strong></p>
  <p>Can't we achieve this way in plain javascript?</p>