Question

我有以下函数，我想将其重新用作“动作”模板，并传递另一个函数作为参数，该函数将作为动作函数，在其中间执行。 / strong>

问题

有可能吗？我该怎么办？

请注意，“操作”是异步的，而且我正在使用React。

function templateAction(action) { try { setLoading(true); setError(null); // DO SOMETHING action(); setLoading(false); } catch(err) { console.log(err); setError(err); setLoading(false); } }

在该action()调用中应执行以下功能：

async function getBlogPost() { const querySnapshot = await firebase.firestore().collection('blog').where('slug','==',props.match.params.slug).get(); console.log(querySnapshot.docs); if (querySnapshot.docs.length === 0) { throw 'ERROR: BlogPost not found...'; } else if (querySnapshot.docs.length > 1) { throw 'ERROR: More than 1 blogPost found...'; } const blogPostData = querySnapshot.docs[0].data(); setFirestoreID(querySnapshot.docs[0].id); setBlogPost(blogPostData); }

SNIPPET

我认为我已经建立了所需的行为（运行摘要）。我可以做得比这简单吗？似乎很多样板。

async function templateAction(action) { try { console.log('Template Action BEFORE calling action'); await action(); console.log('Template Action AFTER calling action'); } catch(err) { console.log(err); } } function action() { return new Promise(async (resolve,reject) => { console.log('I am sync from action function BEFORE async call'); await mockAPI(); console.log('I am sync from action function AFTER async call'); resolve(); }); } function mockAPI() { return new Promise((resolve,reject) => { setTimeout(() => { console.log('I am from async mockAPI call'); resolve(); },1500); }); } templateAction(action);

Answer 1

您可以通过这样的匿名函数传递：https://codesandbox.io/embed/awesome-mayer-52ix7

function templateAction(action) {
  action();
}

let test = function() {
  alert("test");
};

templateAction(test);

对于异步部分，也许您需要做出承诺，这取决于您是否需要确认操作。使用reactJS，您可以通过使用范围发送属性并使用“ this.props”来简化此过程。

Answer 2

这是我的最终代码，使用try catch块捕获错误。

它可以工作，尽管我认为它会损害可读性。

async function templateAction(action) {
  try {
    console.log('Template Action BEFORE calling action');
    await action();
    console.log('Template Action AFTER calling action');
  }
  catch(err) {
    console.log('I was caught and logged');
    console.log(err);
  }
}

function action() {
  return new Promise(async (resolve,reject) => {
    try {
      console.log('I am sync from action function BEFORE async call');
      await mockAPI();
      console.log('I am sync from action function AFTER async call');
      resolve();
    }
    catch(err) {
      console.log('I was caught');
      reject(err);
    }
  });
}

function mockAPI() {
  return new Promise((resolve,reject) => {
    setTimeout(() => {
      console.log('I am from async mockAPI call');
      resolve();
    },1500);
  });
}

templateAction(action);

如何将2个Javascript函数合为一体？

2 个答案: