Javascript 使用 ES6 模块导出/导入单类方法？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38308307/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
export / import single class method using ES6 modules?
提问by Rotareti
Let's say I have a simple class like this in fileA.js:
假设我有一个像这样的简单类fileA.js：
class foo {
constructor(x) {
this.name = x
}
fooMethod(x) {
return x + 'hello';
}
}
And I want to import and use fooMethodin fileB.jslike this:
我想进口和使用fooMethod中fileB.js是这样的：
import { fooMethod } from './fileA';
class bar() {
...
barMethod(x) {
return fooMethod(x);
}
}
How would I write the exportin fileAto achieve this?
我怎么会写export在fileA实现这一目标？
采纳答案by Lux
You would have to export it on the prototype. But remember that if you do that you won't call the function in the class/object context:
您必须将其导出到原型上。但请记住，如果您这样做，您将不会在类/对象上下文中调用该函数：
export foo.prototype. fooMethod
However I would recommend you to not to do so.
但是，我建议您不要这样做。
Okay, due to your comment you want a good way to have a common functionality for two classes, that don't extend the same base class. One simple way is to import a utility function from two classes:
好的，由于您的评论，您想要一种为两个类提供通用功能的好方法，这两个类不扩展相同的基类。一种简单的方法是从两个类中导入一个实用函数：
foo.js
foo.js
export function foo() {
return this.name;
}
a.js
js
import {foo} from 'foo';
export class A extends BaseA {
foo() {
foo.apply(this, arguments);
}
}
b.js
js
import {foo} from 'foo';
export class B extends BaseB {
foo() {
foo.apply(this, arguments);
}
}
This is a good pattern and works well for a single function, but has limits if you want to apply more complex functionality. A good way to achieve this is a mixing pattern:
这是一个很好的模式，适用于单个功能，但如果您想应用更复杂的功能，则存在限制。实现这一目标的一个好方法是混合模式：
foo.js
foo.js
export default superClass => class extends superClass {
foo() {
return this.name;
}
};
a.js
js
import foo from 'foo';
export class A extends foo(BaseA) {
..
}
b.js
js
import foo from 'foo';
export class B extends foo(BaseB) {
..
}
This will make your mixing create a new anonymous class between your class 'A'/'B' and 'BaseA'/'BaseB', which provides the common function foo.
这将使您的混合在您的类 'A'/'B' 和 'BaseA'/'BaseB' 之间创建一个新的匿名类，它提供了通用功能foo。
回答by Tamas Hegedus
You have to export it as a separate variable/constant, like this:
您必须将其导出为单独的变量/常量，如下所示：
class Foo {
fooMethod() {};
}
export const fooMethod = Foo.prototype.fooMethod;
See Babel/repl
Edit
编辑
It turns out in comments that you don't really need an instance method (You don't use this). I would just define and use a regular function:
事实证明，您并不真正需要实例方法（您不使用this）。我只想定义和使用一个常规函数：
export function fooMethod(x) {
return x + 1;
}
回答by Christian Ochuko
You can export and import class methods by instantiating the class which obviously turns it into an object and then exporting each method by destructuring them from the new instantiated object check code example below.
您可以通过实例化类来导出和导入类方法，这显然将其转换为对象，然后通过从下面的新实例化对象检查代码示例中解构它们来导出每个方法。
Destruct and export object methods like this:
像这样销毁和导出对象方法：
class foo {
doSomething() {
// some stuffs
}
doAnotherThing() {
// do something else
}
}
export const { doSomething, doAnotherThing } = new foo()
Then in your file where you want to import the methods do this:
然后在要导入方法的文件中执行以下操作：
import { doSomething, doAnotherThing } from '../class/file/directory'
doSomething() // calls the method
I hope this helps
我希望这有帮助
回答by Calsal
This is how I usually solve exports of functions in helper classes. Using a singleton of a helper class is preferably and that's why it works fine here. Not sure if you're okay with creating a singleton, but it works fine.
这就是我通常解决辅助类中函数导出的方法。最好使用辅助类的单例，这就是它在这里工作正常的原因。不确定你是否同意创建一个单身人士，但它工作正常。
class foo {
constructor(x) {
this.name = x
}
internalFooMethod(x) {
return x + 'hello';
}
}
const singleton = new foo();
export default singleton;
export function fooMethod(x) {
return singleton.internalFooMethod
}
And then import and call it in fileB.js:
然后导入并调用它fileB.js：
import { fooMethod } from './fileA';
class bar() {
barMethod(x) {
return fooMethod(x);
}
}
Of course we can import the default class foo as well as the exported function:
当然，我们可以导入默认类 foo 以及导出的函数：
import FooSingleton, { fooMethod } from './fileA';
回答by Paulo Roberto Dalmas Junior
It's better you don't export methods. Follow this.
最好不要导出方法。按照这个。
fileA
文件A
export class foo {
constructor(x) {
this.name = x
}
fooMethod(x) {
return x + 'hello';
}
}
app.component.ts
app.component.ts
import { Component } from '@angular/core';
import { foo } from './fileA';
@Component({
moduleId: module.id,
selector: 'app-root',
templateUrl: 'app.component.html',
styleUrls: ['app.component.css']
})
export class AppComponent {
title = 'app works!';
constructor(private fooClass: foo){
this.fooClass.fooMethod('');
}
}
