有一次提交project时，被提示 don’t make functions with a loop ，查了些资料后才明白。
上面的代码可以正常输入 1 到 10 。
但上面的代码就会输出10个11 。
当看到输出结果时，想想就明白原因了，因为等到 1 秒后再去输出时，i 的值已经变成 10 了。
就因为容易出现这样的问题，所以不能在 loop 里 make functions 。
参考链接：https://www.youtube.com/watch?v=Nqfs14iu_us
=======20180420更新========
MDN中讲闭包时也有提到这个问题：在循环中创建闭包：一个常见错误
链接：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Closures
阅读更多 →
在用到google map时，其最简单的demo里用到了async和defer。script是html的element，async和defer是script的attributes。
google map demo
https://developers.google.com/maps/documentation/javascript/examples/map-simple
网上有蛮多async和defer分别的作用及对比，两者在fetch其js file时都是异步，这时不影响html加载。async是一fetch到js file就执行，defer是fetch到后等待html加载完了再执行。但如果这两个都放在 前面的地方，那就区别不大了。
另外，async适合这个js file没有依赖其它的file，它自己执行完了不妨碍其它js执行。
async vs defer attributes （这个链接图示了两者的区别，要看）
http://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html
Asynchronous vs Deferred JavaScript （这个链接的结果很重要，要看）
https://bitsofco.de/async-vs-defer/
但上面的文章没有提到这两个属性同时使用的情况，google map demo就是同时用的。
w3中关于这两个属性同时使用有说明。
https://www.w3.org/TR/2011/WD-html5-20110525/scripting-1.html#attr-script-async
The defer attribute may be specified even if the async attribute is specified, to cause legacy Web browsers that only support defer (and not async) to fall back to the defer behavior instead of the synchronous blocking behavior that is the default.
阅读更多 →
上面这个html代码，其实是想限定number的值为小数点后一位，但其实没有实现。在Chrome中这个maxlength会被忽略掉，在IE 11和Edge中最多只能输到小数点（例如1.2）。
正确的做法是用 step
Chrome中的 input number 的 maxlength 会被忽略，其实忽略掉是对的。
MDN input maxlength
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input#attr-maxlength
Is there a float input type in HTML5?
https://stackoverflow.com/questions/19011861/is-there-a-float-input-type-in-html5
阅读更多 →
我觉得上面的 css 写得很奇怪，照理说 * 已经选中了所有的 html elements 了，为什么还要再加上 *::after 和 *::before。
::after 和 ::before 的正式叫法是 psuedo-elements 。
但其实 * 选中的是所有的DOM tree中的element，但 ::after 和 ::before 并不在document tree里。
http://jsfiddle.net/86gc1w6f/
http://jsfiddle.net/gwbp2vpL/1/
CSS:
HTML:
将上面的 content-box 改为 border-box，会发现其实 box-sizing 的修改并没有影响到 p::after。也就是 * (universal selector) 并没有选中 psuedo-elements 。
universal selector 能选中的element是 actual elements，而 psuedo-elements 是DOM中的抽象的 elements，它只是在某个element的前面或者后面硬插入一个不在DOM tree中的 element。
Although pseudo-elements can appear in selector notation alongside simple selectors, pseudo-elements are completely separate from simple selectors as they represent abstractions of the DOM that are separate from actual elements, and therefore both represent different things.
阅读更多 →
其实这个概念蛮好理解的，就是把content, padding, border塞到一个box里，这样在指定width时直接指定的是这个box的width，而不像以前要把content width + padding width * 2 + border width * 2，这样设置起来更方便，也容易理解。
要注意的是不包括margin width。
The CSS Box Model
https://www.w3schools.com/Css/css_boxmodel.asp
CSS Box Sizing
https://www.w3schools.com/Css/css3_box-sizing.asp
学会使用box-sizing布局
https://www.jianshu.com/p/e2eb0d8c9de6
box-sizing
https://developer.mozilla.org/zh-CN/docs/Web/CSS/box-sizing
box-sizing使用场景
https://www.jianshu.com/p/2f2cf326795d
阅读更多 →
在看到一些例子在用Normalize.css，在Html中先加载Normalize.css，再加载自己写的css。对Normalize的第一反应是数学中矢量的单位化，规格化。
其实它是为了
that provides better cross-browser consistency in the default styling of HTML elements.
它在默认的HTML元素样式上提供了跨浏览器的高度一致性。
这我才意识到不同浏览器对HTML元素的默认样式上会有一些不同，想想也确实会这样。另外要注意到的是Normalize.css是在一直更新的，在Github上有源码。
官网
https://necolas.github.io/normalize.css/
Normalize.css source on GitHub
https://github.com/necolas/normalize.css
浅谈Normalize.css
https://www.jianshu.com/p/3d21d1932aa0
矢量运算
https://baike.baidu.com/item/%E7%9F%A2%E9%87%8F%E8%BF%90%E7%AE%97
阅读更多 →
看到一个Demo在Html的Head用到这个，搜了下相关资料。
这个主要是给微软家的浏览器用的，用来告诉Internet Explorer要在哪个版本的IE上Render。对于想支持IE8、IE9这样的旧版本，是需要用到这个标签。但对于IE11或Edge，这个已经不需要了。
Depending upon what Microsoft browsers you support you may not need to continue using the X-UA-Compatible tag. If you need to support IE 9 or IE 8, then I would recommend using the tag. If you only support the latest browsers (IE 11 and/or Edge) then I would consider dropping this tag altogether. If you use Twitter Bootstrap and need to eliminate validation warnings, this tag must appear in its specified order.
阅读更多 →
过年期间买了个电力猫，效果还可以。
腾达，PH3，https://item.jd.com/3478683.html
我没有在局域网内测速，但直接接到电信的电视盒子上，看高清视频很快。想看测速的人可以看京东链接下买家的评论里有人测试。两个电力猫设备的距离大概是3-4米左右。
之前一直没买是有朋友说效果不好不稳定，但我还没有长期使用，目前来看效果还可以。另外，没有直接插在墙上的插座，而是插在从墙上插座接出来的一个排插上。
阅读更多 →
型号：QNAP TS-228，入门级，899元，京东，今年一月份买的。
主要用途是用来同步OneDrive，东西放在OneDrive上还是觉得不够安全，想在本地再同步一份，后来才知道这种做法做混合云（将公有云和私有云混合）。
使用时出现了个问题。
现在用Hybrid Backup Sync来将OneDrive上的东西双向同步到NAS，这个软件是官方的，但同步过程中还是出现了warning，如下图所示。
提示的是我没有权限下载。这个提示很奇怪，因为其它文件可以下载，没道理这三个文件下载不了。我就去看OneDrive网页版上看这三个文件是什么。找到某个文件后，OneDrive提示我这个文件有病毒，如下图所示。
分别找到其它的两个文件，都被OneDrive提示有病毒，我在Windows上用Windows Defender扫描这三个文件，都被提示有毒。后面我干脆就删了这三个文件。
另外，这篇文章写得很好，我目前也是不打算做raid，会继续用混合云的方式，office 365家庭版共5T的空间，够我用的了。
让你的NAS更强大，更安全！使用入门级QNAP 威联通 NAS搭建混合云
阅读更多 →
我是把Unity3D的工程整个放在OneDrive上进行同步，原本是想把代码在公司和家里进行同步，这样就可以方便在家里写代码了（有时代码写了一半，没有push到git server上去，也因为我司git server是在内网）。
用了一段时间后发现，用Visual Studio Community 2015时，经常打不开Unity3D的脚本文件（VS启动了，但成功打开.cs脚本）。Unity提示：
Could not open ‘D:/OneDrive/xxx/Projects/MyUnityProject/Temp/UnityLockfile’: The process cannot access the file because it is being used by another process.
在VS的Solution Explorer中想打开其它.cs文件时，提示：
Cannot access a disposed object.
但把工程移出OneDrive同步目录后就没问题了，暂时还没找到解决方法。
阅读更多 →