如何在JS / React中导出和导入自定义助手？

Question

任务：

• 所以，每次我想使用它时，我宁愿不输入console 。
  我想导入一些速记，例如 -

  log('hi')与console.log('hi')相同console.log('hi')

试过案例：

• 到目前为止，这是我的工作。
  我想使用log, warn, error, info简写到相应的控制台功能。
• 我希望这似乎不是完全不好的做法，但我愿意听。

问题：

• 我很困惑如何导出和导入这些以便使用所需的表示法。

对所有建议开放。
请建议。
谢谢。

log = (arg, ...argv) => console.log(arg, ...argv)
err = (arg, ...argv) => console.error(arg, ...argv)
error = (arg, ...argv) => console.error(arg, ...argv)
info = (arg, ...argv) => console.info(arg, ...argv)
warn = (arg, ...argv) => console.warn(arg, ...argv)

// how to export? should this be a class?

Answer 1

是的，你可以速记。

使用以下函数创建ex： log.js文件。

export const log = (arg, ...argv) => {
    console.log(arg, ...argv)
}
export const err  = (arg, ...argv) => {
  console.error(arg, ...argv)
} 
export const error   = (arg, ...argv) => {
   console.error(arg, ...argv)
}

export const info   = (arg, ...argv) => {
  console.info(arg, ...argv)
}

export const warn   = (arg, ...argv) => {
   console.warn(arg, ...argv)
}

稍后您只需在要使用的其他组件中导入这些函数。

import {log, err, error, info, warn} from './log'; //path may be different

然后只需在任何地方调用函数。

log('hi', [1,2,3]);
err('hi', [1,2,3]);
error('hi', [1,2,3]);
info('hi', [1,2,3]);
warn('hi', [1,2,3]);

Answer 2

ES6中导出功能的常规关键字是导出 （自定义导出功能文件）

export const functionName = (arg, ...argv) => {
   console.log(arg, ...argv)
}

在ES6中导入功能的常规关键字是导入 （自定义导入功能文件）

import { functionName } from './export_function_file';