努力实现javascript承诺

我正在努力使javascript承诺生效。
我在寻找一两个关于我做错了什么的指针。下面是我的代码。我正在尝试将

loadUserPayRateWrapped（）

转换为从数据库获取数据的函数。 我得到的行为是，在

$之前，整个包装器代码集仍在返回。getJSON（）

有机会获取它的数据

正在等待数据请求的函数：

function loadUserPayRateWrapped( projectId )
{

    var URI = "/projects/getAssignedResponsibilities?projectId=" + projectId;
    $.getJSON( URI, function ( data )
    {
        if ( data === null )
            return getDataFromCookie( "payRate" );
        else
        {
            const employeeId = getDataFromCookie( "empId" );
                    if ( data[ 0 ].alternatePay === null )
                return getDataFromCookie( "payRate" );
                    var altPayArray = JSON.parse( data[ 0 ].alternatePay );
                    $.each( altPayArray, function ( idx, element )
            {
                if ( element.uid == employeeId )
                    return element.pay;
            } );
        }

        // nothing was found, so return the regular pay rate
        return getDataFromCookie( "payRate" );

    });

}

包装承诺函数：

function loadUserPayRatePromise( projectId )
{
    var payRateProm = new Promise((resolve, reject) =>
    {
        var payRate = loadUserPayRateWrapped( projectId );
        resolve( payRate );
    });

    payRateProm.then( result => { return payRate } );
}

异步调用方：

async function loadUserPayRate( projectId )
{
    try
    {
        const pay = await loadUserPayRatePromise( projectId );
        return pay;
    }
    catch(error)
    {

    }
}

来自需要数据的主线的代码：

// add the default pay rate for this user
var payRate = loadUserPayRate( data.projectId );
$( "#hourlyRate" ).val( payRate.toFixed(2) );    //payRate must be populated before this line

---

我使用了

window.fetch

，而不是使用

$.fetchJSON

，您肯定可以使用它。并添加了

async

和

wait

以便我们不使用

then

块

//添加了异步
异步函数loadUserPayRateWrapped（projectId）
{
var URI=“/projects/getAssignedResponsibilities？projectd=“+projectd；
//修改了这条线
const data=wait window.fetch（URI）；
如果（数据===null）
返回getDataFromCookie（“payRate”）；
其他的
{
const employeeId=getDataFromCookie（“empId”）；
if（数据[0]。可选路径===null）
返回getDataFromCookie（“payRate”）；
var altPayArray=JSON.parse（数据[0].alternatePay）；
$.each（altPayArray，函数（idx，元素）
{
if（element.uid==employeeId）
返回元素。支付；
} );
}
返回getDataFromCookie（“payRate”）；
}
//添加异步
异步函数loadUserPayRatePromise（projectId）
{
var payRateProm=新承诺（（解决、拒绝）=>
{
//附加等待
var payRate=Wait loadUserPayRateWrapped（projectId）；
解决（工资率）；
});
然后（结果=>{return payRate}）；
}
异步函数loadUserPayRate（projectId）
{
尝试
{
const pay=wait loadUserPayRatePromise（projectd）；
报酬；
}
捕获（错误）
{
}
}

另外，在下面的块中

$。每个（altPayArray，函数（idx，元素）{
if（element.uid==employeeId）
返回元素。支付；
});

从函数内部返回

元素。pay

将导致函数将值返回到内部函数，而不是外部函数。因此，你可以这样做

for（altPayArray的常量元素）{
if（element.uid==employeeId）{
返回元素。支付；
}
}

只需“转换”

$。getJSON

从回调样式转换为Promise是必需的，而且已经足够了

这是我的例子，也许你已经自己处理了错误案例

function loadUserPayRateWrapped(projectId) {
  return new Promise((resolve, reject) => { // wrap callback function into a promise
    var URI = "/projects/getAssignedResponsibilities?projectId=" + projectId;
    $.getJSON(URI, function (data) {
      const defaultPayRate = getDataFromCookie("payRate"); // extract to variable to reuse
      if (data === null) { // recommend style: if block with {}
        return resolve(defaultPayRate);
      } else {
        const employeeId = getDataFromCookie("empId");
        if (data[0].alternatePay === null) {
          return resolve(defaultPayRate);
        }
        var altPayArray = JSON.parse(data[0].alternatePay);
        var foundAltPay = altPayArray.find(p => p.uid === employeeId); // why $.each ??
        // nothing was found, so return the regular pay rate
        return resolve(foundAltPay || defaultPayRate)
      }
    });
  });
}

现在，

loadUserPayRateWrapped

返回一个承诺。然后可以使用Promise样式调用函数，或者使用

async/await

样式：

// Promise style
loadUserPayRateWrapped(data.projectId)
  .then(payRate => {
    $("#hourlyRate").val(payRate.toFixed(2));
  });

// async/await style with IIFE
(async () => {
  const payRate = await loadUserPayRateWrapped(data.projectId); // wait
  $("#hourlyRate").val(payRate.toFixed(2));
})();

---

您需要在

loadUserPayRatePromise

function loadUserPayRatePromise( projectId )
{
    var payRateProm = new Promise((resolve, reject) =>
    {
        var payRate = loadUserPayRateWrapped( projectId );
        resolve( payRate );
    });

    return payRateProm.then( result => { return payRate } );
}

---

如果只想从函数返回一个承诺，请不要命名它

function loadUserPayRatePromise( projectId ) {
    return new Promise((resolve, reject) => {
        var payRate = loadUserPayRateWrapped( projectId );
        resolve( payRate );
    });    
}

使它们异步

async function loadUserPayRatePromise( projectId ) {
    return new Promise(async (resolve, reject) => {
        var payRate = loadUserPayRateWrapped( projectId );
        resolve( payRate );
    });    
}