javascript導出可重用功能

Question

我正在為有很多ajax請求的人構建此應用程序。 我正在使用Q庫進行承諾處理，並且發現很多請求是完全相同的：

export function createAppointment(data) {
    return Q($.ajax({
        type: 'POST',
        url: 'api/appointments',
        data: data,
        contentType: 'application/json; charset=utf-8',
        dataType: 'json'
    }));
}

export function availableAppointments(data) {
    return Q($.ajax({
        type: 'POST',
        url: 'api/appointments/available',
        data: data,
        contentType: 'application/json; charset=utf-8',
        dataType: 'json'
    }));
}

我想做的是定義一個可以調用的函數，該函數接受ajax選項，但可以實現諾言。 我希望它獲得可以覆蓋的默認選項。

例如，在我的情況下，那里的選項如下所示：

{
    type: 'POST',
    data: data,
    contentType: 'application/json; charset=utf-8',
    dataType: 'json'
}

我唯一需要重寫的是url 。 有人可以幫我弄這個嗎？

Answer 1

您可以使用Object.assign用自定義值修補包含默認值的對象。

由於網址每次都會更改，因此我已將其作為唯一參數添加到簽名中。

function performRequest(url, data, options) {
    return Q($.ajax(Object.assign(
    {
        type: 'POST',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json'
    }, 
    options, 
    {   
        url: url,
        data: data,
    }
    )));
}

在這里， data和url將始終覆蓋options的內容。

Answer 2

我試圖自己回答這個問題。 我創建了一個名為data.js的新javascript文件，該文件如下所示：

import Q from 'q';
import $ from 'jquery';

const defaults = {
    contentType: 'application/json; charset=utf-8',
    dataType: 'json'
};

export function httpPost(url, json) {
    const data = JSON.stringify(json);
    const options = Object.assign({}, defaults, { url, data, type: 'POST' });

    return Q($.ajax(options));
}

export function httpGet(url, data) {
    const options = Object.assign({}, defaults, { url, data, type: 'GET' });

    return Q($.ajax(options));
}

在其他JavaScript文件中，我這樣做是：

import { httpPost, httpGet } from './data';

export function createAppointment(data) {
    return httpPost('api/appointments', data);
}

export function availableAppointments(data) {
    return httpPost('api/appointments/available', data);
}

export function listAddresses(postCode) {
    return httpGet('api/addresses', { postcode: postCode });
}