月度归档:2018年05月

关于exports、module.exports和export、export default

使用范围

  • require: node 和 es6 都支持的引入

  • export/import : 只有es6 支持的导出引入

  • module.exports/exports: 只有 node 支持的导出

node 模块

Node里面的模块系统遵循的是CommonJS规范。

CommonJS定义的模块分为: 模块标识(module)、模块定义(exports) 、模块引用(require)

每个模块内部,都有一个module对象,代表当前模块。它有以下属性:

<code class="language-null">module.id 模块的识别符,通常是带有绝对路径的模块文件名。
module.filename 模块的文件名,带有绝对路径。
module.loaded 返回一个布尔值,表示模块是否已经完成加载。
module.parent 返回一个对象,表示调用该模块的模块。
module.children 返回一个数组,表示该模块要用到的其他模块。
module.exports 表示模块对外输出的值。
</code>

为了方便,Node为每个模块提供一个exports变量,指向module.exports。

node中exports和module.exports区别

  • module.exports 初始值为一个空对象 {}
  • exports 是指向的 module.exports 的引用
  • require() 返回的是 module.exports 而不是 exports

因此当直接重新给exports赋值时,外部并不会获取exports的值,而应该使用module.exports

<code class="language-null">//错误写法
exports = {aa: 11}

//正确写法
module.exports = {aa: 11}
</code>

ES中的模块导出导入

export命令规定的是对外的接口,必须与模块内部的变量建立一一对应关系。

<code class="language-null">// 写法一
export var m = 1;

// 写法二
var m = 1;
export {m};

// 写法三
var n = 1;
export {n as m};
</code>

使用export default命令,为模块指定默认输出。

<code class="language-null">// export-default.js
export default function () {
  console.log('foo');
}
</code>
  • export 和 export default的区别:
    1. export与export default均可用于导出常量、函数、文件、模块等
    2. 在一个文件或模块中,export、import可以有多个,export default仅有一个
    3. 通过export方式导出,在导入时要加{ },export default则不需要
    4. export能直接导出变量表达式,export default不行。

参考

exports、module.exports和export、export default到底是咋回事

ECMAScript 6 入门 阮一峰 export命令

金额添加千分符

当前的问题

发现parseFloat(234234).toLocaleString()在给金额添加千分符的时候,safari浏览器会无效,包括ios中的webview中同样无效。

解决方式一:采用纯正则的方式(Safari报错)

<code class="language-null">//采用零宽断言
'12345678.56'.replace(/\d{1,3}(?=(\d{3})+(\.\d+)*$)/g, '$&amp;,').replace(/(?&lt;=\.(\d+\,)*\d+),/g, '')
//输出"12,345,678.56"
</code>

正则主要使用后向引用,采用replace(/\d{1,3}(?=(\d{3})+(\.\d+)*$)/g, '$&,') 匹配前面有三个数字的部分,并添加逗号;使用replace(/(?<=\.(\d+\,)*\d+),/g, '')替换掉小数点后面的逗号。

  • (?=exp) 匹配exp前面的位置
  • (?<=exp) 匹配exp后面的位置
  • (?!exp) 匹配后面跟的不是exp的位置
  • (?<!exp) 匹配前面不是exp的位置
    参考正则表达式后向引用详解

正则中还使用了replace的$&引用,规则如下:

字符 替换文本
$1、$2、...、$99 与 regexp 中的第 1 到第 99 个子表达式相匹配的文本。
$& 与 regexp 相匹配的子串。
$` 位于匹配子串左侧的文本。
$' 位于匹配子串右侧的文本。
$$ 直接量符号。

参考JavaScript replace() 方法

这种方式Chrome下可以正常工作,但是Safari下会报错:Invalid regular expression: unrecognized character after (?,第二个正则报错了。

虽然上面的实现方式看起来挺优雅,然并卵,safari下正则报错,仍旧不能解决问题。

解决方式二:采用半正则半拼接的方式

<code class="language-javascript">//封装的函数
function money2String(amount){
    let amount_arr = amount.toString().split('.');
    amount_arr[0] = amount_arr[0].replace(/\d{1,3}(?=(\d{3})+(\.\d+)*$)/g, '$&amp;,');
    return amount_arr.join('.');
}
</code>

此方法Safari和Chrome均可用,没啥好讲的,over。