Javascript小技巧总结
提醒:本文发布于 3428 天前,文章内容可能 因技术时效性过期 或 被重新修改,请谨慎参考。
一.传参和原型链
(function test(a){ |
借助这个传参方式,可以这么用:
"".constructor.constructor("alert('string')")(); |
说不定可以用作XSS攻击的手段
二.执行环境
执行环境(execution context)的具体实现就是变量对象,也称作上下文对象(variable object)全局执行环境的变量对象就是window.(即window代表全局作用域)
执行环境栈:(execution context stack), 每个要被执行的函数都会先把函数的 执行环境 [压入] 执行环境栈 , 函数开始执行 然后 函数在变量对象里创建作用域链对象,函数执行完毕后,这个函数的执行环境就会被执行环境栈弹出, 执行环境栈的控制权由内向外依次交付.
作用域链: 函数执行环境被压入到执行环境栈中, 函数就执行了, 函数执行的第一步是在变量对象里构造一个作用域链, 作用域链保证变执行环境里有权访问的变量和函数是有序的
this指针构造是和作用域链同时发生的,也就是说在上文变量构建作用域链的同时还会构造一个this对象,this对象也是属于上下文变量,而this变量的值就是当前执行环境外部的上下文变量的一份拷贝.
三.变量声明
(function() { |
把console.log(a)
放在下面是因为这个一定会报错,因为变量a执行完就马上被销毁了.b为5很显然,因为这样成了全局变量,它实际上是:
b = 5; |
应该避免这种很容易让人误会
的变量声明方式,除非你必须这么做.
四.new四部曲(也有说是三部曲)
1.创建一个新对象;
2.将构造函数的作用域赋给新对象(因此this就指向了这个新对象);
3.执行构造函数中的代码(为这个新对象添加属性);
4.返回这个新建的对象;
五.this
document.getElementById("btnTest").onclick = function(){ |
六.修改原则
- 不要为实例或者原型添加属性
- 不要为实例或者原型添加方法
- 不要重定义已经存在的方法
七.避免全局多次调用
- 除非必要,变量声明在局部.全局搜索会更慢
- 多次访问的数据可以缓存起来
- 不要使用with
八.声明优化
- 对象字面量
- 直接数组
- 声明多个变量用逗号分开
九.repaint reflow
var list = document.getElementById("mylist"), |
- 如需更新,尽量使用文档碎片更新(如以上例子)
- 尽量最小化这两个的更新
- 使用innerHTML来插入节点
十.注意HTMLCollection
HTMLCollection的访问会有巨大的开销.因为每一次访问都是最新获取的结果,可是通常会有这样的情况发生:(囧)
var imgs = document.getElementsByTagName('img'); |
这些都是值得注意的地方:
- 对getElementsByTagName()的调用
- 获取元素childNodes属性
- 获取元素attributes属性
- 访问特殊集合如:document.forms/document.images等
十一.相等和严格相等
用严格相等,避免某些情况下相等符号带来的类型装换
访客评论