javascript - 如何将内部函数值作为参数传递给其回调

Question

很抱歉，我不知道确切的措辞，所以请耐心等待。我想做的事情与我们对事件监听器所做的事情是一样的:

foo.addEventListener('click', function(event) {
    console.log(event.target)
})

通过上面的示例，我可以使用匿名回调函数访问事件实例。就我而言，我有这个简单的功能:

function post_rqst({ url, data = '', callback }) {
    let request = new XMLHttpRequest();
    request.open("POST", url, true);
    request.onload = function() {
        callback()
    }
    request.send(data)
}

现在，当我调用 post_rqst() 时，我希望能够访问回调定义中的 request 实例，如下所示:

post_rqst({
    url: 'foo.com/bar/',
    data: '[x,y,z]',
    callback: function(request) {
        if (request.status === 200) {
            console.log('done!')
        }
    }
})

我是一个 javascript 新手，我不知道我不知道什么。感谢您提前的指导。

Answer 1

您可以在调用callback时传递该request实例，而不是:

function post_rqst({ url, data = '', callback }) {
    let request = new XMLHttpRequest();
    request.open("POST", url, true);
    request.onload = function() {
        callback();
    };
    request.send(data);
}

你会:

function post_rqst({ url, data = '', callback }) {
    let request = new XMLHttpRequest();
    request.open("POST", url, true);
    request.onload = function() {
        callback(request);
    };
    request.send(data);
}

在这里您可以看到使用 setTimeout 来伪造该请求的实际情况:

function fakePost({ url, data = '', callback }) {
    const request = { url, data, method: 'POST' };
    
    setTimeout(() => {
      callback(request);
    }, 1000);
}

fakePost({
  url: 'https://stackoverflow.com/',
  data: 'foobar',
  origin: 'https://stackoverflow.com/',
  callback: (req) => {
    console.log('Callback received req =', req);
  },
});