Creeper
Creeper
就标题而言，这是七八篇里起得最满意的，高大上，即使外行人也会不明觉厉！ :joy: 不过不是开玩笑，本文的确打算从`__proto__`和`prototype`这两个容易混淆来理解JS的终极命题之一：**对象与原型链**。 ### `__proto__`和`prototype` #### `__proto__` 引用《JavaScript权威指南》的一段描述： > Every JavaScript object has a second JavaScript object (or null , > but this is rare) associated with it. This second...
伴随 React 兴起， Virtual DOM 也越来越火，各种各样的实现，各个 UI 库的引入等等。snabbdom 就是 Virtual DOM 的一个简洁实现。不过在解读 snabbdom 之前，首先谈一谈 Virtual DOM 。 ### 什么是 Virtual DOM ？ 在谈论 Virtual DOM 之前，必须要理解：什么是 DOM ？ DOM 即...
看到过下面这样一道题： ``` js (function test() { setTimeout(function() {console.log(4)}, 0); new Promise(function executor(resolve) { console.log(1); for( var i=0 ; i promise.then(onFulfilled, onRejected) > > 2.2.4 onFulfilled or onRejected must not be...
时值公司全面切换到HTTPS和HTTP/2，讨论HTTP/2有了更现实的意义。以前也断断续续看了些文章，做了些了解，这里算作一个学习和总结吧。 本文定位入门级别，分作两大块： - HTTP/2是什么 - 基于HTTP/2前端可以做什么优化 本文参考了一些*博文和资料*，后面已列出，感谢他们的分享。 ## HTTP/2简介 > HTTP/2 is a replacement for how HTTP is expressed “on the wire.” It is not a ground-up rewrite of the...
从[原博客](http://creeperyang.github.io/2015/04/frontend-questions-and-answers/)迁移过来（有更改），并将保持更新。 --- 关于JavaScript，工作和学习过程中遇到过许多问题，也解答过许多别人的问题。这篇文章记录了一些有价值的问题。 ### 1. 对象字面值不能正确解析 **问题**：`{a:1}.a`报错，错误`Uncaught SyntaxError: Unexpected token .`。 **解决**： ``` js ({a:1}.a) // 或({a:1}).a ``` **原因**： [MDN: Object literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Object_literals) > An object literal is a list of...
> 不知不觉，从事前端 4 年多了，距离本篇的前作 *[JavaScript问题集锦](https://github.com/creeperyang/blog/issues/2)* 也有 2 年多了 —— 青葱岁月啊。 > 又忽然想起“我变秃了，也变强了！”的梗，正好程序员工作久了，容易变秃... 当然我没有秃，所以说 😂 > 收起半夜突然来的感概，正式解释下文章题目和目的： > 本文还是会以 JS 的一个个知识点为粒度来讲，这算是对之前那篇的继承。这个秋天，静极思动，面了BA以及其它一些公司，和面试官的尬聊中，有些觉得很懂的东西并没有解释的很好，这里也提醒下自己和大家：**学无止境**。 ### 1. 从 IIFE 说一说 Expression 和 Statement IIFE (Immediately...
> 对程序员来说，持续学习是很重要的。这里记录一些（未/待）读完的高质量文章/视频。 > 尽量敦促自己每周至少读完一篇。 | 时间 | 标题（含链接）| 描述 | 形式 | 时长 | 进度 | | ---- | ---------------| -----| -----| -----|-----| |2018/12/05| [A Quest to Guarantee Responsiveness: Scheduling...
有天刷掘金，看到这样一篇文章[利用Android源码，轻松实现汉字转拼音功能](http://blog.coderclock.com/2017/04/04/android/2017-04-04/)，非常感兴趣，花了两个多小时，阅读了博客和代码，算是弄懂了原理。然后就想，是不是可以从Java移植到JavaScript。 本篇博客记录的就是阅读和折腾的过程，顺便提醒自己，借助现代浏览器的能力（API），几百行代码可以轻松搞定汉字转拼音。 --- *2017/05/12 更新：* 依据本篇博客编写的汉字转拼音库 [tiny-pinyin](https://github.com/creeperyang/pinyin) 已上线，越300行代码左右，可轻松阅读。Online demo 地址 ，可放心体验。  ### 一. 汉字转拼音的现状 首先应该说，汉字转拼音是个强需求，比如联系人按拼音字母排序／筛选；比如目的地（典型如机票购买） 按拼音首字母分类等等。但是这个需求的解决方案，但好像没听过什么巧妙的实现（特别是浏览器端），大概都需要一个庞大的字典。 具体到JavaScript，查查github和npm，比较优秀的处理汉字转拼音的库有[`pinyin`](https://github.com/hotoo/pinyin)和 [`pinyinjs`](https://github.com/liuxianan/pinyinjs)，可以看到，两者都自带了庞大的字典。 这些字典动辄几十上百KB（有的甚至几MB），想在浏览器端使用还是需要一些勇气的。所以当我们碰到汉字转拼音的需求，也不怪我们第一反应就是拒绝需求（或者服务端实现）。 现在，如果我告诉你可以浏览器端 300 行代码实现汉字转拼音，是不是不可置信？ ### 二. 从安卓4.2.2联系人代码说起 再次强调这篇博客——[利用Android源码，轻松实现汉字转拼音功能](http://blog.coderclock.com/2017/04/04/android/2017-04-04/)。 > 今天和大家分享一个从Android系统源代码提取出来的汉字转成拼音实现方案，只要一个类，560多行代码就可以让你轻松实现汉字转成拼音的功能，且无需其他任何第三方依赖。 是不是打破了你的思维定势：难道有什么强大的算法可以抛弃字典？...
React 在 `v16` 引入了[众多新特性](React16新特征总览)，其中最核心的更新属于引入了新的核心架构 Fiber （Fiber reconciler，代替之前的 Stack reconciler），本文主要是对 fiber 的学习过程的记录。 ### 一、为什么需要 Fiber ？ 长话短说就是：**性能**。 > In its current implementation React walks the tree recursively and calls render functions...
一直觉得前端优化是个挺复杂的东西（可能是我比较菜 :joy: ）： 1. 某些优化方向是相对/相反的，实际中并没有简单统一的规则来直接套用。比如 _减少http请求_ 和 _外联css/js文件_ 就是相对的。 2. 优化在不同平台（PC/Mobile），不同网络状况，不同协议（http/http2）等等要侧重的东西都有所不同，规则可能有所变化。 3. 优化并不是独立的系统，可能要考虑到代码维护，可读性等等其它因素。 4. ...