在多个文件中拆分 ES6 Class 以导入库的各个方法

Question

假设我为辅助方法构建了一个库 class。我有一个包含字符串实用程序的文件，一个包含 ajax 实用程序等的文件。

主要 class 看起来像这样：

// helperUtils.js
export class helperUtils {
  constructor() {}

  basicHelperFn() {
    return true;
  }
}

现在我有一个导出这些字符串实用程序的文件：

// helperUtils/stringUtils.js
import { helperUtils } from '../helperUtils.js';

helperUtils.prototype = { 
  stringUtil1 : (str) => { 
    return str += ' this is very helpful!';
  }
}

export const stringUtils = helperUtils.prototype;

// more files...
// helperUtils/ajaxUtils.js
// helperUtils/objUtils.js
// ...

我现在如何导入主要 class 并仅使用拆分成多个文件的一些原型方法对其进行扩展，例如仅导入字符串 utils。

import { helperUtils } from './helperUtils';
import { stringUtils} from './helperUtils/stringUtils';

const helper = new helperUtils();
helper.basicHelperFn();
helper.stringUtil1();

Answer 1

如果你的 stringUtils class extends helperUtils class:

// helperUtils/stringUtils.js
import { helperUtils } from '../helperUtils.js';

class StringUtils extends helperUtils {
    stringUtil1(str) {
         return str += ' this is very helpful!';
    }
}

export StringUtils;

然后您可以简单地导入并使用它。

Answer 2

是这样的吗？

/*
 helperUtils/stringUtils.js 
*/
import { helperUtils } from '../helperUtils.js';

class StringUtils extends helperUtils {
    super();
    constructor() {}
    stringUtilNew(x) {
         /*
          Do somthing...
          */
         return x;
    }
}

export StringUtils;

Answer 3

我做了更多的实验：

这是我现在想到的：

// helperUtils/stringUtils.js
import { helperUtils } from '../helperUtils.js';

helperUtils.prototype.stringUtil1 = (str) => { 
    return str += ' this is very helpful!';
}

export const stringUtils = helperUtils.prototype;

现在 stringUtils 原型不会覆盖我的 helperUtils 原型，我可以安全地将单个方法导入到我的 main class。

如果有人有更好的解决方案，请与我们分享！

至此谢谢！

在多个文件中拆分 ES6 Class 以导入库的各个方法

Split ES6 Class in multiple files to import individual methods of a library

javascript

inheritance

prototype

class

ecmascript-6