仅显示以下 5 篇带「方法」关键字的文章。 返回词云  或  查看全部文章

Map 的两个小扩展

2018-09-03 by Dron

在以前,实现数据映射,我们利用给对象属性赋值,就像这样:

var mapping = Object.create( null );
mapping[ key ] = value;

ES6 的 Map/WeakMap 提供了更为便利及语义化的用法,功能更加强大,key 支持所有数据类型:

const mapping = new Map;
mapping.set( key, value );

通过继承 Map/WeakMap,很容易扩展功能,以 Map 为例,本文讲述一个带 过期控制持久化 能力的 Map 扩展。

图片 RGBA 拾色器

2016-05-24 by Dron

前端同学在切页面时,很多简单效果可以直接 CSS3 实现掉,这样就不必使用图片了,大大减少图片处理的时间。

市面上的拾色器,包括 PhotoShop 中的吸管,都没有提供图片像素中 Alpha 通道的值,遂用 <canvas>getImageData 方法简单实现了个在线版,有需要的同学请自行收藏。

getImageData 方法返回画布上指定矩形区域的 ImageData,包括该区域中所有像素点的 R、G、B、A 四个通道的颜色信息。上一篇文章 也提到它。

JavaScript 执行覆盖分析工具 —— Tracker

2013-01-14 by Dron

这个工具写了有小半个月了,本来想等做完美了再发出来,想想每天的进展这样慢就算了,先发也能更早收到使用者的反馈,初版肯定会有很多 bug,希望大家能够向我提出来。

为了能更快速的完成开发,我们往往会在项目里引入各种各样的 JS 库,而实际上,项目本身对这些 JS 库的利用率很少,很多情况下只是用了它其中的一两个功能,这样导致项目产生大量的冗余代码,一定程度上影响了网页加载速度,如果有方便的工具,可以分析出项目在运行过程中覆盖到的 JS 代码,将大大有利于我们做后续的瘦身工作,Tracker 这个工具的想法就这样产生的。另外,和 JSCoverage 一样,Tracker 也能帮助我们方便地发现测试用例对源码的覆盖程度。

危险:IE 下使用 cloneNode 注意事项

2012-04-20 by Dron

在开发「百度地裂特效」时,发现了一些匪夷所思的 Bug,第一反应是特效本身的代码与页面上原有的脚本发生了冲突,经过调试发现,问题出现在 cloneNode

cloneNodeHtmlElement 上的方法,用于创建指定 DOM 节点的拷贝,它接受一个布尔参数 include_all,如果 include_all 设置为 true,则副本会带有指定节点的所有子节点。

然而,<script> 标签也是 DOM 节点,cloneNode 对其有效,经实测各浏览器(尤其是 IE)对 cloneNode 执行结果表现不一致,主要现象为以下两种:

  • IE,至少是 IE8 及以下,对某节点 cloneNode 时,如果该节点包含 <script> 节点,那么 <script> 节点的脚本内容「有可能」会被再次执行一次。
  • 非 IE 浏览器,cloneNode 某节点,包含的 <script> 节点的脚本内容不会被再次执行。

IE 以外的浏览器表现令我满意,而针对于上面所述 IE 的「有可能」,还分以下两种情况:

通过挟持 this 指针在 JavaScript 中模拟 private

2011-11-06 by Dron

JavaScript 是一种解释型的、基于对象的脚本语言,没有严格意义上的类,在这一点上不同于 C++、Smalltalk 或者 Java,不过作为替代,它支持构造函数(constructors),可通过执行代码创建对象:给对象分配存储,然后通过赋初始值来初始化对象属性的全部或部分。构造函数有个指向其原型对象的属性叫做 prototype,利用 prototype 可模拟出一个基本可用的“类”来。

类有封装、继承和多态等特征,其中继承和多态不是本文关注的,本文侧重于探讨类封装中关于私有成员(private)的实现。