如何从此特定的IIFE JS结构公开公共api？

Question

In AspNetZero/ABP, the default index.js for an entity looks like the following:

(function () {
    $(function () {

        var _$formulationFrequenciesTable = $('#FormulationFrequenciesTable');
        var _formulationFrequenciesService = abp.services.app.formulationFrequencies;

        function additionalFilter() {
            return {
                nameFilter: // something
                prop2: // something else
            };
        }

        // more code

  });
})();

We are using Telerik's AspNetCore Kendo on the Razor, so we define the grid like so:

Html.Kendo().Grid<PatientManagement.Formulations.Dtos.GetFormulationFrequencyForViewDto>()
.Name("gridFormulationFrequencies")
.DataSource(d =>
{
    d.Custom()
     .Type("aspnetmvc-ajax")
     .ServerFiltering(true)
     .ServerPaging(true)
     .ServerSorting(true)
     .Schema(s => s.Aggregates("aggregateResults").Data("data").Errors("errors").Total("total").Model(model => model.Id(m => m.Id)))
     .Transport(t => t.Read(read => read.Action("FormulationFrequency_Read", "FormulationFrequencies", new { area = "App" }).Data("additionalData").Type(HttpVerbs.Get)));
})
.Deferred(true).Render();

How can I make additionalData "public" so that I can use it in the grid definition? I understand that the first line of the js is IIFE, and the second is short hand js for jQuery(document).ready() .

I've been having issues trying to define a public API because everything is defined within the scope of the document ready, and IIFE examples I've seen don't include this curveball.

Answer 1

One way would be to assign a reference to the function to a window property.

If you have to do this often you could have a global object of your own in window namespace and assign as a property to that object instead

(function () {
    $(function () {

        var _$formulationFrequenciesTable = $('#FormulationFrequenciesTable');
        var _formulationFrequenciesService = abp.services.app.formulationFrequencies;

        function additionalFilter() {
            return {
                nameFilter: // something
                prop2: // something else
            };
        }

        // add to global window namespace
        window.additionalFilter = additionalFilter;


        // more code

  });
})();