掌握了这些东西才算真正掌握了Javascript(一)。
下面这些东西都不是我创造的,是我认为的一些书中的精华,关于Javascript的精华,通过学习,我觉得自己对Javascript的认识有了进一步的提升,弄清了一些或者称之为技巧或窍门的东西。我会把这些知识运用到一个新的框架中去,新的框架的目标是用JS展示各种图表,虽然已经有了很多该功能的框架,但是我觉得还是有必要创建一个自己的,因为我的终极目标是实现一个报表系统,中间需要这一块。呵呵!!!,敬请关注。下面言归正传,开始我们的Javascript高手必须掌握的东西。这个东西会很长,可能会以连载的方式发布。
DOM与浏览器相关
分离关注点: WEB应用包括3个部分,内容(HTML)、展示(CSS)、行为(Javascript)。开发应用时,使这3部分尽可能的分离。
DOM访问
减少DOM访问到最小:
1、避免在循环访问DOM;
// 不好 for(var i = 0; i < 100; i += 1){ document.getElementById('result').innerHTML += i + ', '; } // 好 var i, content = ''; for(i = 0; i < 100; i += 1){ content += i + ', '; } document.getElementById('result').innerHTML += content;
2、使用局部变量持有DOM引用;
// 不好 var padding = document.getElementById(‘result’).style.padding, margin = document.getElementById("result").style.margin; // 好 var style = document.getElementById(’result‘).style, padding = style.padding, margin = style.margin;
3、可以的话使用选择器API;
选择器只有比较流行的浏览器才有,也可以使用一些类库,如JQuery
document.querySelector("ul .selected"); document.querySelectorAll("#widget .class");
4、遍历HTML元素集时缓存length;
DOM操作
如有可能使用document fragment辅助添加DOM节点;
事件
事件代理
长时间运行脚本
Web Workers
远程运行脚本
语言:
常见转换
x + "" => String(x)
+x => Number(x)
x-0 => Number(x)
!!x => Boolean(x)