《怎样使拼接HTML字符串更快.docVIP

Javascripts Paradise Make Javascript more powerfully and easily 怎样使拼接HTML字符串更快 November 1st, 2009 . Posted in Javascript分析 | No Comments ?Tags: Javascript 拼接HTML代码，是经常会碰到的事情，如果拼接的HTML的代码量很小，就无所谓使用什么方法，可一旦数据量过大，那就得讲究一下拼接方法了。 或许很多人都会使用的一种方法是纯粹的字符串通过”+”符号拼接，如： view source print? 1.var arr = [item 1, item 2, item 3, ...], 2.????list = ; 3.?? 4.for (var i = 0, l = arr.length; i l; i++) { 5.????list += li + arr[i] + /li; 6.} 7.?? 8.list = ul + list + /ul; 但是这样方式拼接的速度非常慢，而且没有什么技巧性。 而第二种方法，大家或许会使用数组的方式，通过push来拼接，最后join一次，如： view source print? 1.var arr = [item 1, item 2, item 3, ...], 2.????list = []; 3.?? 4.for (var i = 0, l = arr.length; i l; i++) { 5.????list[list.length] = li + arr[i] + /li; 6.} 7.?? 8.list = ul + list.join() + /ul; 这个方法或许会比第一种方法好些，利用了数组的高效性，但是还有没有更好的方法呢？请看下面的例子： view source print? 1.var arr = [item 1, item 2, item 3, ...]; 2.?? 3.var list = ulli + arr.join(/lili) + /li/ul; 够简介吧！！而且值得说明的是，第三种方法比第一、二中方法在各个浏览器测试都普遍高效了几倍！让我们来看看各种方法在各个浏览器的执行时间比较：从这个测试中可以发现，第三种方法明显比第一、二种方法高效，所以，本人推荐使用第三种方法。当然，拼接HTML的时候也不一定都是拼接ul，li标签，这要根据实际拼接的HTML标签的情况来选择不同的方法。 替代使用switch…case的方法 November 1st, 2009 . Posted in Javascript分析 | No Comments ?Tags: Javascript 今天在浏览James Padolsey的博客时，看到了他一篇关于替代使用switch…case的方法，评论的人也不少，《How to avoid switch-case syndrome》。 比如下面是一种使用switch…case的模式写的代码： view source print? 01.switch (something) { 02.????case 1: 03.????????doX(); 04.????break; 05.????case 2: 06.????????doY(); 07.????break; 08.????case 3: 09.????????doN(); 10.????break; 11.????// And so on... 12.} 这个代码使用起来基本没有问题，可是本人也都觉得，用switch…case分支来设计函数，有点显得丑陋，代码不够简练，当然，这种方式比起用if…else[ if]…来又好了很多，可是又没有另外一种方式来替代switch…case的呢？下面是James Padolsey提出的方法： view source print? 1.var cases = { 2.????1: doX, 3.????2: doY, 4.????3: doN 5.}; 6.if (cases[something]) { 7.????cases[something](); 8.} 他是通过对象字面量的方式来存储条件，并且通过验证给的条件时候已存在于对象字面量中来实现检测和做下一步的事情。对象字面量有这么一个好处，可以通过判断它的属性是否存在，而确定如何执行代码；这跟数组不同，数组需要遍历才能知道一个元素是否已经存在于数组中。 因此，选择使用对象字面量还是数组来存储数据的前提就是：如果数据不是连