ES6导出默认，具有多个相互引用的功能

Question 1

在es6中，您可以定义这样的功能模块

export default {
    foo() { console.log('foo') }, 
    bar() { console.log('bar') },
    baz() { foo(); bar() }
}

上面的代码似乎是有效的代码，但是如果我调用baz()它，则会引发错误：

ReferenceError: foo is not defined

您如何foo从另一个函数调用？在这种情况下baz

编辑

这是实际上不起作用的代码。我简化了代码，因此只是所需的核心

const tokenManager =  {
  revokeToken(headers) { 
    ... 
  },
  expireToken(headers) {
    ...
  },
  verifyToken(req, res, next) {
    jwt.verify(... => {
      if (err) {
        expireToken(req.headers)
      }
    })
  }
}

export default tokenManager

错误是

expireToken(req.headers);
        ^
ReferenceError: expireToken is not defined

编辑2

我只是尝试添加tokenManager之前expireToken，它终于可以了

Question 2

该export default {...}建筑是只是像这样的快捷方式：

const funcs = {
    foo() { console.log('foo') }, 
    bar() { console.log('bar') },
    baz() { foo(); bar() }
}

export default funcs

现在，它必须变得明显，有没有foo，bar或者baz在模块的范围功能。但是有一个名为funcs（虽然实际上没有名称）的对象，该对象包含这些函数作为其属性，并且将成为模块的默认导出。

因此，要修复您的代码，请在不使用快捷方式的情况下重新编写代码，并引用foo和bar作为属性funcs：

const funcs = {
    foo() { console.log('foo') }, 
    bar() { console.log('bar') },
    baz() { funcs.foo(); funcs.bar() } // here is the fix
}

export default funcs

另一种选择是使用this关键字来引用funcs对象，而不必像@pawel所指出的那样明确声明它。

另一个选择（也是我通常更喜欢的一个选择）是在模块范围内声明这些函数。这允许直接引用它们：

function foo() { console.log('foo') }
function bar() { console.log('bar') }
function baz() { foo(); bar() }

export default {foo, bar, baz}

而且，如果您希望方便地使用默认导出功能并可以单独导入项目，则还可以单独导出所有功能：

// util.js

export function foo() { console.log('foo') }
export function bar() { console.log('bar') }
export function baz() { foo(); bar() }

export default {foo, bar, baz}

// a.js, using default export

import util from './util'
util.foo()

// b.js, using named exports

import {bar} from './util'
bar()

或者，正如@loganfsmyth建议的那样，您可以不使用默认导出而只使用import * as util from './util'一个对象中的所有命名导出。

Question 3

一种选择是更换模块。通常，如果要导出带有一堆函数的对象，则导出一堆命名函数会更容易，例如

export function foo() { console.log('foo') }, 
export function bar() { console.log('bar') },
export function baz() { foo(); bar() }

在这种情况下，您将导出所有带有名称的函数，因此您可以执行

import * as fns from './foo';

获取具有每个函数的属性的对象，而不是用于第一个示例的导入：

import fns from './foo';

Question 4

tl; dr： baz() { this.foo(); this.bar() }

在ES2015中，此构造：

var obj = {
    foo() { console.log('foo') }
}

等于此ES5代码：

var obj = {
    foo : function foo() { console.log('foo') }
}

exports.default = {} 就像创建对象一样，您的默认导出将转换为ES5代码，如下所示：

exports['default'] = {
    foo: function foo() {
        console.log('foo');
    },
    bar: function bar() {
        console.log('bar');
    },
    baz: function baz() {
        foo();bar();
    }
};

现在，它很明显（我希望）baz试图调用foo并bar在外部范围的某个地方定义（未定义）。但是this.fooandthis.bar将解析为exports['default']object中定义的键。因此，默认的导出引用了自己的方法，如下所示：

export default {
    foo() { console.log('foo') }, 
    bar() { console.log('bar') },
    baz() { this.foo(); this.bar() }
}

请参阅babel repl编译的代码。