天方夜

不患人之不己知,患不知人也

  • Home
  • Archives
  • Tags
  • Categories
  • About

JavaScript 中的异步:Event Loop 及其他

Posted on 2016-09-30   |   In 编程

异步

简单地说,JavaScript 是单线程执行的语言,但在使用中有很多异步执行的情况。异步的本质是用其他方式(相对同步)控制程序的执行顺序,这与其他语言中的多线程模型不同,所以常常有人对非顺序 JavaScript 代码的运行结果感到困惑不解。

一段简单的小程序

任何使用过 JavaScript 的程序员都能说出下面这段代码的输出:

1
2
3
4
5
6
7
console.log("A");

setTimeout(() => {
console.log("B");
}, 100);

console.log("C");

先后顺序是 A、C、B,因为第二个参数的作用是指定延迟的毫秒数,这段代码只有一个 setTimeout,所以不会让人迷惑。

对类似程序的解释通常是由 setTimeout 设置一个定时器,在指定毫秒数后调用回调函数。然而,它的执行机制并不是这么简单。实际上,setTimeout 的作用是在指定的毫秒数之后,在得到机会时,将 callback 放入 Event Loop Queue。

Event Loop

Read more »

使用 Karma、Mocha、Chai 搭建支持 ES6 的测试环境

Posted on 2016-09-02   |   In 编程

前端开发很多是界面开发,但我们可以将相对独立的逻辑和功能从整体业务逻辑中独立出来,这样就可以对它们做单元测试。使用 Karma 可以比较方便地搭建出测试环境。

安装 Karma

使用 Karma Mocha Chai(启动器、测试框架、断言库)组合。

1
npm install karma karma-mocha karma-chai --save-dev

如果 npm 版本 >=3.0,会看到如下提示:

UNMET PEER DEPENDENCY chai@*
karma@1.2.0
karma-chai@0.1.0
karma-mocha@1.1.1
UNMET PEER DEPENDENCY mocha@*

这是因为 npm 已经不再自动安装 peerDependencies:
We will also be changing the behavior of peerDependencies in npm@3. We won’t be automatically downloading the peer dependency anymore. Instead, we’ll warn you if the peer dependency isn’t already installed. This requires you to resolve peerDependency conflicts yourself, manually, but in the long run this should make it less likely that you’ll end up in a tricky spot with your packages’ dependencies.

Read more »

CSS:min-height百分比问题

Posted on 2015-11-04   |   In 编程

对于高度不确定的页面,想实现总是撑满一屏的效果,可以结合 height 与 min-height 来设置,但是有一些瑕疵。

示例 1:

1
2
3
4
5
6
html {
min-height: 100%;
}
body {
min-height: 100%;
}

html 与 body 都设置为 min-height: 100%,意图是想页面高度不足一屏时 body 高度为一屏的高度,高度超过一屏则 body 的高度为页面的高度。但这样设置后会发现, html 的高度变成了 100%(一屏的高度),而 body 的高度却是 0。那么将 body 的子元素设为 min-height: 100% 时,这个元素的高度自然也是 0(除非靠内容撑开)。

试验发现,如果将 min-height 的值设置为百分比,那么上一级元素必须有一个明确的高度(不能是 min-height: 100%),否则高度是 0。

Read more »

PPK《移动Web手册》读书笔记

Posted on 2015-10-01   |   In 编程

浏览器

大多数内置浏览器都被紧密集成到底层的操作系统中,无法单独升级。设备供应商经常拒绝给他们的内置浏览器命名,iOS 的内置浏览器叫作 Safari,而 Android、黑莓、塞班的内置浏览器没有名字,作者把它们叫作「安卓WebKit」「黑莓WebKit」「塞班WebKit」。

安卓

一个智能系统需要一个浏览器,安卓系统提供了基于 WebKit 的浏览器;它没有名字,英文网站上一般称之为「Android Browser」,作者称之为「安卓WebKit」。

安卓WebKit 并不是 Chrome:它有完全分离的代码库,里面有完全分离的漏洞。查看 userAgent 是否含有 Chrome 这个单词,可以区分 安卓WebKit 与 Chrome。安卓WebKit 包含大量开关,用来打开或关闭特定功能,设备厂商可以随心所欲地设置这些开关。所以 三星安卓WebKit 与 索尼安卓WebKit 并不相同。

Read more »

URL字符集的编码与解码:escape unescape encodeURI decodeURI encodeURIComponent decodeURIComponent

Posted on 2015-09-06   |   In 编程
  • escape
    unescape
  • encodeURI
    decodeURI
  • encodeURIComponent
    decodeURIComponent

这六个方法功能有关联,如果不清楚每一个的作用,很容易混淆。问题的本质,是如何在 URL 中正确处理各种令人头疼的字符。

Read more »

Base64:window.atob 的兼容性问题

Posted on 2015-09-06   |   In 编程

对于 Base64 编码,浏览器提供的原生方法是 window.btoa 和 window.atob。

1
2
var encodedData = window.btoa("Hello, world"); // encode a string
var decodedData = window.atob(encodedData); // decode the string

从 caniuse.com 的数据来看,IE10 才开始支持这两个方法;而 iOS 和 Android 都很早就支持了,似乎可以用在移动端。但是在使用 atob 的过程中,还是遇到了兼容性问题。在 Chrome for Android 中可以正常解码,但是在 iOS Safari 中出现了下面这个错误:

DOM Exception 5: An invalid or illegal character was specified, such as in an XML name

无奈之下,还是找了个第三方库 https://github.com/dankogai/js-base64,用了之后 Android、iOS 都可以正常解码了。

JavaScript 分号问题

Posted on 2015-06-06   |   In 编程

现状

JavaScript 分号之争由来已久,目前最被认可的结论是:JavaScript 语句末尾是否加分号是一个编程风格问题,可以加,也可以不加。

选择

事情总要有个决定的!
——卫斯理《只限老友》(卫斯理系列最后一句话)

那么,到底加不加分号呢?

既然是一个风格问题,我们要明白的是如何选择。选择之前,我们来看看做出选择的前提是什么:

  • 加分号:前提是你了解如何以加分号的方式写 JavaScript。

  • 不加分号:前提是你了解如何以不加分号的方式写 JavaScript。

Read more »

木心《文学回忆录·先秦诸子·老子》阅读笔记

Posted on 2015-03-07   |   In 杂文

  写这篇笔记,当然是因为喜欢这本书的文字,但书中很多观点我都不赞同,尤其关于老子的。本文中我对《老子》的认识很多来自李航的《道纪》一书。

穷·白·空

一穷,穷在经济上;二白,白在文化上;三空,空在思想上。

  现在经济腾飞了,但是雾霾来了,两难。文化和思想,能说的太多,不说了。文中这句话是在说哪个年代?应该看它的下一句:

所以,唯物论之类进来,没有抵挡。

  现在为何没人讨论唯物唯心了?因为现代物理学已经把宇宙模型研究的比较完整,整个宇宙的生死都快要研究清楚了,只是大爆炸那个奇点和爆炸后一秒钟这两个状态的物理规律还没弄清。哲学思想早已跟不上物理学的进展,这就是霍金在《大设计》中所讲的“哲学死了”。唯物、唯心都是静态、割裂的看待问题,正确的方式应该是彼得·圣吉在《第五项修炼》中所说的“系统思考”。

Read more »

思考2014

Posted on 2015-01-01   |   In 杂文

文学

  前两年开始,感觉到纯文学能给人通俗文学无法替代的东西,应该是或多或少体会到了一些纯文学之美。

  有所突破是从《白象似的群山》开始,人物的对话不断给真正的情节增加可能性,这个小说的悬念与阅读进度不是简单的正相关。只有简单的对话,感觉是个很简单的故事,但令人琢磨不透。我相信每个人都是独立的,没有人可以完全理解另一个人的想法,《白象似的群山》正是写出了这种感觉。我们看别人的事情,永远只是套用自己理解的生活。

Read more »

使用 localStorage

Posted on 2014-10-18   |   In 编程

localStorage 属于 Web 存储的一个 API(另一个是 sessionStorage),以 Key-Value 的形式保存数据,key 和 value 都是字符串。

容量

每个浏览器的容量限制不同,现代浏览器一般是 5M。检测容量:Web Storage Support Test

安全性

以未加密的形式保存在用户的计算机上。

Read more »
1234
天方夜

天方夜

天方夜的博客

36 posts
2 categories
70 tags
RSS
© 2022 天方夜
Powered by Hexo
Theme - NexT.Muse