如何仅将键及其值作为javascript对象的参数传递

Question

Just to reduce length of my code i decided to create javascript function to initialize select2 plugin. right now i am writing very lengthy code to initilize one element.

$("#add_multiple_lr #trips_div .last_added .location_id").select2({
  initSelection: function(element, callback) {
    var elementText = $(element).attr('json-value');
    callback(JSON.parse(elementText));
  },
  minimumInputLength: 2,
  ajax: {
    url: "<?php echo site_url('masters/locations/json_search'); ?>",
    dataType: 'json',
    type: "POST",
    quietMillis: 50,
    data: function (term) {
      return {
        term: term,
        location_type: 'station',
        location_county: ['india', 'bangladesh']
      };
    },
    results: function (data) {
      return {
        results: $.map(data, function (item) {
          return {
            text: item.text,
            id: item.id
          }
        })
      };
    }
  }
});

for one or two elements its ok, to write this code, but when it comes to 10-15 elements it becomes really confusing and lengthy code for that i developed below code.

function initSelect2(reference, url, additional_data = {}, minimumInputLength = 2)
{
  $(reference).select2({
    initSelection: function(element, callback) {
      var elementText = $(element).attr('json-value');
      callback(JSON.parse(elementText));
    },
    minimumInputLength: minimumInputLength,
    ajax: {
      url: url,
      dataType: 'json',
      type: "POST",
      quietMillis: 50,
      data: function (term) {
        return {
          term: term,
          additional_data
        };
      },
      results: function (data) {
        return {
          results: $.map(data, function (item) {
            return {
              text: item.text,
              id: item.id
            }
          })
        };
      }
    }
  });
}

and calling it as

initSelect2(
  "#add_multiple_lr #lr_party, #add_multiple_lr #lr_payable_party",
  "<?php echo site_url('masters/locations/json_search'); ?>",
  {location_type: 'station', location_country: ['india', 'bangladesh']}
);

i just want to return additional_data (a parameter)'s keys and their property.

Answer 1

You can use the spread syntax for this:

return {
    term,
    ...additional_data
};

For older browsers you could rely on the jQuery extend method (as you seem to use jQuery):

return $.extend({ term: term }, additional_data);

Answer 2

When your environment supports latest ECMAScript, you can use object-spread syntax:

return {
  term: term,
  ...additional_data
};

Otherwise you could use Object.assign():

return Object.assign({term: term}, additional_data);