Question

76

export / import single class method using ES6 modules?

rated 0 times [ 82] [ 6] / answers: 1 / hits: 46353 / 8 Years ago, mon, july 11, 2016, 12:00:00

Let's say I have a simple class like this in fileA.js:

class foo {

    constructor(x) {

        this.name = x

    }



    fooMethod(x) {

        return x + 'hello';

    }

}

And I want to import and use fooMethod in fileB.js like this:

import { fooMethod } from './fileA';



class bar() {

    ...

    barMethod(x) {

        return fooMethod(x);

    }

}

How would I write the export in fileA to achieve this?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

hallie

Add To Favorites

Follow

Total Points: 503

Total Questions: 114

Total Answers: 103

Location: Iraq

Member since Fri, Jun 5, 2020

4 Years ago

hallie questions

1 Uncaught TypeError: Cannot read properties of undefined (reading 'navigate')

Fri, Jan 28, 22, 00:00, 2 Years ago

1 isSameOrBefore implementation for date-fns

Fri, Jul 9, 21, 00:00, 3 Years ago

1 Module build failed when using mini-css-extract-plugin with postcss-loader for less

Thu, May 27, 21, 00:00, 3 Years ago

1 d3.js in Angular - Property 'event' does not exist on type 'typeof import

Wed, Nov 11, 20, 00:00, 4 Years ago

1 Uncaught SyntaxError: Unexpected token '< ' VueJS PWA

Fri, Mar 27, 20, 00:00, 4 Years ago

View All

answered 8 Years ago lesterluiss · Accepted Answer

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

export function foo() {

  return this.name;

}

a.js

import {foo} from 'foo';

export class A extends BaseA {

  foo() {

    foo.apply(this, arguments);

  }

}

b.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

export default superClass => class extends superClass {

  foo() {

    return this.name;

  }

};

a.js

import foo from 'foo';

export class A extends foo(BaseA) {

  ..

}

b.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.