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

时间:2018-10-25 14:33:32

标签: javascript jquery jquery-select2

只是为了减少代码长度,我决定创建javascript函数来初始化select2插件。现在,我正在编写很长的代码来初始化一个元素。

$("#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
          }
        })
      };
    }
  }
});

对于一个或两个元素来说,可以编写此代码,但是当涉及到10-15个元素时,对于我在下面的代码中开发的代码来说,确实变得令人困惑且冗长。

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
            }
          })
        };
      }
    }
  });
}

并将其称为

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']}
);

我只想返回Additional_data(一个参数)的键及其属性。

2 个答案:

答案 0 :(得分:1)

您可以为此使用传播语法:

return {
    term,
    ...additional_data
};

对于较旧的浏览器,您可以依赖jQuery extend方法(好像您使用的是jQuery):

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

答案 1 :(得分:0)

当您的环境支持最新的ECMAScript时,您可以使用对象传播语法:

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

否则,您可以使用Object.assign():

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