减少重复代码，尝试将函数分配给变量 - 不起作用

Question

为了减少重复代码，我尝试创建一个 if 语句来为变量分配函数或其他函数，但这没有用！？

我尝试做的是

const graphCall = (params['sfid'] === 'potential_engagements') ?  this.engagementService.potentialsGraph() : this.engagementService.graph()

该语法本身不会引发错误，但是当我尝试使用时

graphCall.then(animate =>

……不行！我是否遗漏了什么，我可以不分配函数吗，是否有另一种类似或不同的方法来检查和删除重复的代码？

我的代码：

if (params['sfid'] === 'potential_engagements') {
    this.engagementService.potentialEngagements = true;
    this.engagementService
      .potentialsGraph()
      .then(animate => {
        this.graph = new EngagementGraph(d3.select('.Engagement-GraphSVG'));
        this.track();
        this.engagementService.isGraph = true;
        this.engagementService
          .getAllProducts()
          .then(() => this.downloading = false)
          .catch(err => this.pdfError = true)
        this.findForumContact();
        this.updateDateLabel();
        this.addMemberPicture();
        this.setup(animate);
      })
      .catch(error => this.handleError(error));
} else {
    this.engagementService
      .graph(params['sfid'])
      .then(animate => {
        this.graph = new EngagementGraph(d3.select('.Engagement-GraphSVG'));
        this.track();
        this.engagementService.isGraph = true;
        this.engagementService
          .getAllProducts()
          .then(() => this.downloading = false)
          .catch(err => this.pdfError = true)
        this.findForumContact();
        this.updateDateLabel();
        this.addMemberPicture();
        this.setup(animate);
      })
      .catch(error => this.handleError(error));
}

如有帮助，谢谢！

Answer 1

potential_engagements 块有两个其他块没有的东西：

this.engagementService.potentialEngagements = true; <------
this.engagementService
  .potentialsGraph() <------
  .then(animate => {

另一个块只有一个东西另一个块没有：

this.engagementService
  .graph(params['sfid']) <------
  .then(animate => {

.then(animate 和它后面的一切都是一样的，所以我建议将所有这些抽象成一个函数，也许叫做 handleGraphProm:

const handleGraphProm = prom => prom.then(animate => {
  this.graph = new EngagementGraph(d3.select('.Engagement-GraphSVG'));
  this.track();
  this.engagementService.isGraph = true;
  this.engagementService
    .getAllProducts()
    .then(() => this.downloading = false)
    .catch(err => this.pdfError = true)
  this.findForumContact();
  this.updateDateLabel();
  this.addMemberPicture();
  this.setup(animate);
})
.catch(error => this.handleError(error));

并调用它：

if (params['sfid'] === 'potential_engagements') {
  this.engagementService.potentialEngagements = true;
  handleGraphProm(this.engagementService.potentialsGraph());
} else {
  handleGraphProm(this.engagementService..graph(params['sfid']));
}

Answer 2

它不起作用的原因可能是因为您有一个额外的 this.engagementService.potentialEngagements = true 未在三元运算中分配。将 potentialsGraph 和 graph 返回的 thenable 放入变量中。然后在上面调用 then:

let graphCall;

if (params['sfid'] === 'potential_engagements') {
  this.engagementService.potentialEngagements = true;
  graphCall = this.engagementService.potentialsGraph()
} else {
  graphCall = this.engagementService.graph(params['sfid'])
}

graphCall.then(animate => {
    this.graph = new EngagementGraph(d3.select('.Engagement-GraphSVG'));
    this.track();
    this.engagementService.isGraph = true;
    this.engagementService
      .getAllProducts()
      .then(() => this.downloading = false)
      .catch(err => this.pdfError = true)
    this.findForumContact();
    this.updateDateLabel();
    this.addMemberPicture();
    this.setup(animate);
  })
  .catch(error => this.handleError(error));

减少重复代码，尝试将函数分配给变量 - 不起作用

Reduce duplicated code, trying to assign a function to a variable - doesnt work

javascript

dry

function