为什么词汇范围内的这种不匹配会发生?

时间:2017-01-27 18:33:31

标签: javascript node.js debugging lexical-scope

这个问题发生在Node 6.9.4和7.0.0中,我无法弄清楚原因。我还没有在其他版本中测试过。请参阅下面的Node.js程序中的注释:

const express = require('express');
const adaro = require('adaro');

const app = express();

const tabs = require('./config/tabs.json');
const config = require('./config/locals.js');

function getLocals(name) {
  const modifiedTabs = config.tabs.map(tab => {
    return Object.assign(tab, {active: tab.name === name});
  });

  return Object.assign({tab: name}, config, {tabs: modifiedTabs});
}

app.engine('dust', adaro.dust());
app.set('view engine', 'dust');
app.set('x-powered-by', false);

app.use(express.static('static'));

tabs.map(tab => tab.name).forEach(name => {
  const locals = getLocals(name);
  const tab = locals.tabs.find(tab => tab.active);

  // these are always true
  console.log(tab === locals.tabs.find(tab => tab.active));

  function callback(req, res) {
    // const locals = getLocals(name);
    // this should be true, but is false unless the line above is commented in
    console.log(tab === locals.tabs.find(tab => tab.active));
    res.render('main', locals);
  }

  if (tab.url !== '/' + tab.id) {
    app.get(tab.url, callback);
  }

  app.get('/' + tab.id, callback);
});

app.all('*', function (req, res) {
  res.sendStatus(404);
});

app.listen(process.env.PORT || 8000);

任何人都可以解释为什么会发生这种情况以及如何解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

我发现了这个问题。在getLocals()中,我正在执行

const modifiedTabs = config.tabs.map(tab => {
  return Object.assign(tab, {active: tab.name === name});
});

Object.assign(tab, ...)每次调用现有的tab对象时都会覆盖它,只留下每个标签的最后一个分配。因此,所有视图都将数组中的最后一个选项卡显示为活动状态,因为所有active属性都已被最后一个选项卡配置覆盖。

解决方案是将参数切换为Object.assign(),以便创建返回的对象而不是覆盖:

return Object.assign({active: tab.name === name}, tab);