使用范围

• 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的$&引用，规则如下：

参考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。

最近开始用vscode，发现还是挺好用的，微软开发的轻量级开源IDE，支持多平台，插件也很丰富。下面说一个今天get到的技能。设置vscode自定义代码片段，让撸码更快捷。

操作步骤

• 首先按下快捷键Ctrl+P
• 输入>snippet，选择“首选项：配置用户代码片段”
• 输入php，选择php.json
• 在打开的php.json文件中，编辑模版

编辑模版示例

<code class="language-null">{
    // Place your snippets for php here. Each snippet is defined under a snippet name and has a prefix, body and 
    // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
    // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
    // same ids are connected.
    // Example:
    // "Print to console": {
    //  "prefix": "log",
    //  "body": [
    //      "console.log('$1');",
    //      "$2"
    //  ],
    //  "description": "Log output to console"
    // }

    "Print to debug": {
        "prefix": "dd",
        "body": [
            "echo Debug::vars(\\$ddd$0);"
        ],
        "description": "echo log"
    },
    "json request": {
        "prefix": "json",
        "body": [
            "\\$this-&gt;check_view(array('json'));",
            "\\$params = \\$this-&gt;arg_filter(\\$this-&gt;request-&gt;post$0(), array('code'));",
            "\\$v = Validation::factory(\\$params);",
            "\\$v-&gt;rule('code', 'not_empty');",
            "\\$this-&gt;check_valid(\\$v);",
            "\n",
            "\\$ret = \\$this-&gt;itg_interface(array(",
            "\t'parent_code' =&gt; \\$params['code'],",
            "));",
            "\\$this-&gt;view_data = \\$this-&gt;convert_output(\\$ret);"
        ]
    }
}
</code>

注意点

• 除了php还可以选其他语言
• prefix表示输入的内容，按tab键后会出现body中的内容
• $0表示光标位置
• body中的每一项，表示一行
• $这种特殊符号要转义，tab要用\t替代，换行要用\n替代，

iPad忘记锁屏密码了，密码重试过多，已经不能重新输入密码，提示要连接iTunes，电脑上安装iTunes之后，连接时itunes提示需要iPad解锁屏幕，死锁了- -。

专门跑去苹果店问了下，解决方案如下：

１、电脑安装iTunes，安装后，打开itunes但不用登录苹果帐号

2、iPad连接到电脑

3、同时按住Home键和侧边的锁屏键，长按7、8秒，iPad屏幕变黑时，松开锁屏键，但Home键仍然需要按住，大约5、6秒，电脑上的itunes会出现“iTunes检测到一个处于恢复模式的iPad。您必须先用备份来恢复该iPad然后才能将它与iTunes配合使用。”，点击确定。

4、在电脑上itunes接下来的界面中，选择“恢复iPad”。

5、接下来按提示操作即可，重新激活iPad

注意：

1、此方法会让iPad恢复出厂设置，之前的数据会丢失。

2、需要重新激活iPad，可以使用新帐号激活。

一、关于Sharp
Sharp是用于代理请求的Fiddler插件。
之前代理请求时多使用willow插件，willow的强大之处我就不在此赘述，用过的人都知道。虽然willow很好用，但是仍有痛点，尤其是在代理请求时，像我这种有强迫加懒惰症的人，每次都要选择路径，给文件起名，保存文件到本地，然后设置代理时还要再查找一次文件路径，不够快捷。为了解决文件命名、选择文件保存路径、读取路径的痛点，本插件诞生了~

二、Sharp特性
1、根据设置匹配url路径。
2、直接编辑响应内容，无需在本地保存文件。
3、支持将左侧会话列表拖动到Sharp插件中，并根据会话内容自动填充表单，新建代理配置。
4、匹配POST参数，当请求的url相同而post参数不同时，可通过设置匹配post参数过滤请求。
5、设置别名，可以设置一个方便记忆的名字显示在列表中，方便查找。

三、Sharp插件下载和安装
下载地址：http://realwall.cn/download/sharp_1.1.6.zip
将文件下载的压缩包解压，将Sharp.dll和文件夹Sharp复制到 Fiddler安装目录/Scripts/ 中（注意复制时要关闭Fiddler），启动Fiddler即可在插件栏看到Sharp的选项卡。

四、使用方法
1、打开Fiddler，切换到Sharp选项卡。
2、在浏览器中发起请求，使请求会话出现在Fiddler左侧会话列表中。
3、将需要代理的会话拖动到Sharp的列表中，即出现设置代理窗口。
4、编辑url匹配规则和响应内容，点击确定，则将代理配置添加到了Sharp中了。
5、再次刷新页面，响应即被替换了

 五、注意事项
1、该插件需Fiddler4以上版本使用，低版本插件将不会显示。如果安装后没有出现对应的选项卡，请升级Fiddler版本。

移动端页面事件触发顺序和事件触发规则不同于PC端，一般都知道click在移动端会延迟200~300ms触发。
本文从实例出发，演示移动端事件的触发规则和顺序。

HTML页面：

<body>
<script type="text/javascript">
var firstEmitTime = 0;
//页面输出日志
function showLog(msg){
    var p = document.createElement('p');
    p.innerHTML = msg;
    document.body.appendChild(p);
}
</script>

<a href="javascript:
    var aa='href: ' + ((new Date()).getTime() - firstEmitTime);
    showLog(aa);console.log(aa);"
    id="aa">This is a href</a>
<script type="text/javascript" src="tmp.js"></script>
</body>

tmp.js文件：

var aa = document.getElementById("aa");
var eventTypeArr = ['click', 'touchstart', 'touchmove', 'touchend', 
        'mousedown', 'mousemove', 'mouseover', 'mouseup'];

for(var i = 0; i < eventTypeArr.length; i++){
    //利用闭包保存eventType，当回调函数触发时会访问该闭包的环境变量对象
    (function(){
        var eventType = eventTypeArr[i];
        aa.addEventListener(eventType, function(){
            var curTime = (new Date()).getTime();
            if(firstEmitTime === 0){
                firstEmitTime = curTime;
            }
            //打印当前事件触发时间与第一个事件触发时间的差值
            var log = eventType + ': ' + (curTime - firstEmitTime);
            console.log(log);
            showLog(log);
        });
    })();
}

在iPhone4/iOS7.0.4上如果点击（非长按），则输出结果大多为（事件触发顺序不变，间隔时间略有不同）：
touchstart:0
touchend:204
mouseover:243
mousemove:243
如果长按链接，经一百多次测试，下面是两种输出结果，约70%是第一种情况（由于受点击时长和力度的影响，此数据仅供参考）：
第一种：
touchstart:0
mouseover:2238
mousedown:2239
mouseup:2243
click:2244
href:2245

第二种：
mouseover:0
mousedown:0
mouseup:5
click:5
href:5
其中，href内为JavaScript代码时，浏览器会提示是否打开，需要点击打开，才会输出mouseover及其后面的值，因此与touchstart的间隔可能不是200~300ms。
从结果可以看出该环境下：
1、与click触发时，touchstart未必触发；
2、mouse系列事件与click事件是相近时间内触发，大约在touchstart后延迟200~300ms后触发。

在华为MT1-U06/Android4.1.2上点击链接（非长按），测试一百多次，主要有下面三种结果，出现概率分别为70%、25%和5%（由于受点击时长和力度的影响，此数据仅供参考）：
第一种：
mouseover:0
mousemove:6
touchstart:12
touchend:568
mousedown:869
mouseup:874
click:876
href:879

第二种：
mouseover:0
mousemove:7
mousedown:387
mouseup:392
click:394
href:396

第三种：
mouseover:0
mousemove:8
touchstart:12
touchmove:91
touchend:95
可以看出该环境下：
1、mouse事件会先于touch事件开始，而迟于其结束。
2、click和href事件触发仍是最后触发，会延迟300ms左右。

1、直接添加代码块
通过script标签，可直接将JavaScript代码嵌入网页
Example:

<script type="text/javascript">
  document.write("Hello World!")
</script>

2、加载外部脚本

<script charset="utf-8" src="example.js"></script>

直接将script标签写在页面上，浏览器加载时会阻塞页面渲染，知道js加载完成。

异步加载的脚本可以这样引入

<script src="js/require.js" defer async="async"></script>

其中，defer规定是否对脚本执行进行延迟，直到页面加载为止。但只有Internet Explorer支持defer属性。
async属性可以保证脚本下载的同时，浏览器继续渲染。一旦渲染完成，再执行脚本文件，这就是“非同步执行”的意思。需要注意的是，一旦采用这个属性，就无法保证脚本的执行顺序。哪个脚本先下载结束，就先执行那个脚本。IE 10支持async属性，低于这个版本的IE都不支持。如果同时使用async和defer属性，后者不起作用，浏览器行为由async属性决定。

如果 async="async"：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）
如果不使用 async 且 defer="defer"：脚本将在页面完成解析时执行
如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本

3、动态嵌入脚本
创建script元素，插入页面，可动态嵌入脚本，如下：

var jsfile = ['/js/logic/ee.js', '/js/logic/ff.js'];
for(var i = 0; i < jsfile.length; i++){
    var script = document.createElement('script');
    script.src = jsfile[i];
    script.async = false;
    var src = jsfile[i];
    script.onload = function(){
        console.log('onload ' + this.src);
    }
    document.head.appendChild(script);
}

不管async是不是设置为false，都不会阻塞页面渲染。但设置async为false，可保证按照添加到页面的顺序加载js，设置为true或不设置都不会按顺序加载。
还有就是，js加载下来后会立即执行，然后才会执行onload方法。

参考：
http://javascript.ruanyifeng.com/bom/engine.html

一、概述
jshint是检测JavaScript语法问题的工具，可以根据自己的需要配置检测规则。

二、安装
npm install jshint -g
一般全局安装就可以了，可以在任何目录下使用jshint命令。

三、简单的使用方法
1、检测单个js文件语法
在myfile.js所在的目录运行：
jshint myfile.js
2、检测当前目录及其子目录所有js文件的语法
jshint ./

四、配置文件
有以下三种方法设置jshint配置文件
1、使用 --config 选项指定配置文件
Example:
jshint --config ./aaa ./
表示检测当前目录内所有的js文件，并指定配置文件为当前目录下的aaa文件。
2、使用 .jshintrc 文件，如果在运行jshint是，如果没有--config 选项，则会以当前目录的.jshintrc文件为配置文件，如果当前目录没有这个文件，则以其父目录.jshintrc 文件配置文件，仍没有的话，则继续找其父目录，直至根目录。
3、在nodejs项目的package.json文件的jshintConfig字段中设置配置文件。

五、内嵌配置
除了使用配置文件配置检测规则外，还可以在js文件内，使用特殊的注释，配置检测规则。
Example:
/* jshint undef: true, unused: true */
/* global MY_GLOBAL */
或者
// jshint undef: true, unused: true
这两种注释方式都是可以的，其中global参数告诉JSHint，该变量是全局变量，从其他js引入的。而且这些注释的作用域是函数内，这意味着如果你把这段注释放在某个函数内，则该配置只在该函数内起作用。

六、JSHint的配置选项（转自：http://www.zipeng.info/archives/jshint-intro.html）
asi
如果是真，JSHint会无视没有加分号的行尾，
自动补全分号一直是Javascript很有争议的一个语法特性。默认，JSHint会要求你在每个语句后面加上分号，但是如果你认为自己理解了asi(automatic semicolon insertion)，你可以抛弃JSHint对分号的检查。

bitwise
如果为真，JSHint会禁用位运算符
Javascript允许位运算，但是他却没有整型，位运算符要把参与运算的数字从浮点数变为整数，并在运算后再转换回来。这样他们的效率就不如在别的语言中那么高。

boss
很霸气的选项，如果为真，那么JSHint会允许在if，for，while里面编写赋值语句。
一般来说，我们会在循环、判断等语句中加入值的比较来做语句的运行条件，有时候会把==错写成赋值的=，通常，JSHint会把这个认定为一个错误，但是开启这个选项的化，JSHint就不会检查判断条件中的赋值 ，你是boss，你说的算:)。

curly
如果为真，JSHint会要求你在使用if和while等结构语句时加上{}来明确代码块。
Javascript允许在if等结构语句体只有一句的情况下不加括号。不过这样做可能会让你的代码读起来有些晦涩。

debug
如果为真，JSHint会允许代码中出现debugger的语句。不过建议你最好在检测代码前去掉debug的语句。

eqeqeq
如果为真，JSHint会看你在代码中是否都用了===或者是!==，而不是使用==和!=。
我们建议你在比较0，''(空字符)，undefined，null，false和true的时候使用===和!===。

eqnull
如果为真，JSHint会允许使用"== null"作比较。
== null 通常用来判断一个变量是undefined或者是null（当时用==，null和undefined都会转化为false）。

evil
如果为真，JSHint会允许使用eval
eval提供了访问Javascript编译器的途径，这有时很有用，但是同时也对你的代码形成了注入攻击的危险，并且会对debug造成一些困难。
记住，Function构造函数也是另一个‘eval’，另外，当传入的参数是字符串的时候，setTimeout和setInterval也会类似于eval。

forin
如果为真，那么，JSHint允许在for in 循环里面不出现hasOwnProperty，
for in循环一般用来遍历一个对象的属性，这其中也包括他继承自原型链的属性，而hasOwnProperty可以来判断一个属性是否是对象本身的属性而不是继承得来的。

immed
如果为真，JSHint要求匿名函数的调用如下：
(function(){
//
}());
而不是
(function(){
//bla bla
})();

laxbreak
如果为真，JSHint则不会检查换行。
Javascript会通过自动补充分号来修正一些错误，因此这个选项可以检查一些潜在的问题。

maxerr
设定错误的阈值，超过这个阈值jshint不再向下检查，提示错误太多。

newcap
如果为真，JSHint会要求每一个构造函数名都要大写字母开头。
构造器是一种使用new运算符来创建对象的一种函数，new操作符会创建新的对象，并建立这个对象自己的this，一个构造函数如果不用new运算符来运行，那么他的this会指向全局对象而导致一些问题的发生。

noarg
如果为真，JSHint会禁止arguments.caller和arguments.callee的使用
arguments对象是一个类数组的对象，它具有一个索引值。arguments.callee指向当前执行的函数（这个在ES5的严格模式中被禁用了），而arguments.caller指向调用当前函数的函数（如果有的话），并且，他并不是在所有的Javascript实现里面都有。

noempty
如果为真，JSHint会禁止出现空的代码块（没有语句的代码块）。
如果为真，JSHint会禁用构造器，以避免一些问题。
在JSLint中会主动禁用构造器的方式以避免一些潜在问题，但其实很多构造器的使用并非有害，例如如下的调用
new JsUIWindow();
//注意这个调用是没有把构造器的结果赋值给变量的
因此，我们需要使用构造器的时候可以禁用这个选项。

nomen
如果为真，JSHint会禁用下划线的变量名。
很多人使用_name的方式来命名他们的变量，以说明这是一个私有变量，但实际上，并不是，下划线只是做了一个标识。
如果要使用私有变量，可以使用闭包来实现。

onevar
如果为真，JSHint期望函数只被var的形式声明一遍。

passfail
如果为真，JSHint会在发现首个错误后停止检查。

plusplus
如果为真，JSHint会禁用自增运算和自减运算
++和--可能会带来一些代码的阅读上的困惑。

regexp
如果为真，JSHint会不允许使用.和[^...]的正则，
因为这样的正则往往会匹配到你不期望的内容，并可能会应用造成一些危害。

undef
如果为真，JSHint会要求所有的非全局变量，在使用前都被声明。
如果你不在一个本地作用域内使用var的方式来声明变量，Javascript会把它放到全局作用域下面。这样会很容易引起错误。

sub
如果为真，JSHint会允许各种形式的下标来访问对象。
通常，JSHint希望你只是用点运算符来读取对象的属性（除非这个属性名是一个保留字），如果你不希望这样可以关闭这个选项。

strict
如果为真，JSHint会要求你使用use strict;语法。
Strict 模式是ES5里面的一个新特性，他允许你把一个程序或者函数放在一个“严格”的作用域中。可见Resig写的一篇关于严格模式的blog
严格模式做了几件事情，
1、他可以捕获一些错误和异常
2、当我们进行一下“不安全”的操作时，他会抛异常，例如访问全局变量。
3、他会禁止你使用一些奇淫技巧，或者不良的代码编写。

white
如果为true，JSHint会依据严格的空白规范检查你的代码。

一、搭建环境
nodejs和MySQL的安装就不说了，安装好后，通过npm安装MySQL模块。
在自己nodejs项目的根目录，运行
npm install mysql --save
其中，--save是将mysql模块写入package.json文件的依赖模块配置中，也可以不添加此选项。

二、创建数据库
运行下面的sql语句，可创建一个简单的数据库和user表
创建数据库tsnode

CREATE DATABASE `tsnode`;

创建表user

CREATE TABLE `user` (
`userid` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(45) DEFAULT NULL COMMENT '账号',
`password` varchar(45) DEFAULT NULL COMMENT '密码',
`userdesc` varchar(145) DEFAULT NULL COMMENT '备注',
`birthday` datetime DEFAULT CURRENT_TIMESTAMP COMMENT '生日',
`logincount` int(11) DEFAULT '0' COMMENT '登录次数',
PRIMARY KEY (`userid`),
UNIQUE KEY `iduser_UNIQUE` (`userid`)
) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8 COMMENT='table for user manage';

三、项目js文件中引入mysql模块并操纵数据库
1、连接数据库并查询，将返回数据从控制台输出

var mysql = require('mysql');
var connection = mysql.createConnection({
    'host': 'localhost',
    'user': 'root',
    'password': 'passoo',
    'port': '3307',
    'database': 'tsnode'
});

connection.connect();
connection.query('select * from user limit 0,10', function(err, rows, fields){
    if(err) throw err;
    console.log(rows);  // 输出查询结果JSON
    var birthday = rows[0].birthday;
    console.log(birthday.getTime());  // 输出生日
    console.log(fields);  // 输出字段属性
});
connection.end();

2、使用连接池

/**
 * 使用连接池
 */
var mysql = require('mysql');
var pool = mysql.createPool({
    'host': 'localhost',
    'user': 'root',
    'password': 'passoo',
    'port': '3307',
    'database': 'tsnode'
});

pool.getConnection(function(err, connection){
    console.log('1 connected!');
    // 执行SQL语句
    connection.query("INSERT INTO `tsnode`.`user` (`username`, `password`, `userdesc`) VALUES ('realwall', 'passoo', 'This is user desc2')", function(err, result){
        if(err){
            connection.rollback(function(){
                throw err;
            });
        }
        console.log('connection 1 insert');
        console.log(result);
        // 将连接释放到连接池
        connection.release();
        console.log('connection 1 released');
    });
});

pool.getConnection(function(err, connection){
    if(err) throw err;
    console.log('2 connected!');
    // 执行SQL语句
    connection.query('select * from user limit 0,10', function(err, rows){
        console.log('connection 2 query');
        console.log(rows);
        // 将连接释放到连接池
        connection.release();
        console.log('connection 2 released');
    });
});