#js 全局变量局部变量 ###函数内部未申明的变量自动变成全局变量 ##变量是附在window中的 js函数内部使用`use strict`；必须放到第一行 使用严格模式，避免犯一些错误 **chrome source 可以打断点 并在console中输出 使用**`console.log()` #javascript 没有整型和浮点型 单精度双精度的 isNaN()判断是否是不够的 NaN === NaN 为false 和NaN比较的数字才是真正的NaN `if(! NaN === num(NaN)){ } x !== x NaN == NaN 是false ` 判断用！取反 是不严格的 if(!x){ x =12; } 因为 false,0,-0,'',NaN, null 和 undefined 在if判断里都是 false 应该这样写 if(typeof x == "undefined"){ } chrome 的 profile 可以做性能评测 那个方法花费了多长时间 ##导航菜单的三角地带 可以用jquery-menu-aim.js ##导航菜单 只能从服务器取一次 ###jsonp可以从本地取远程的数据 例如京东 跨域请求 可以jsonp 和设置http协议中的一个cache-origon ###天猫导航菜单用了localstorage 可以在chrome resource 的localstorage 中看到 #### 2 天猫的三级加速 a) ajax取数据(网络上) b) localStorage 取数据(硬盘上) c) 当前页面元素或者JS变量里取(内存里) #### 发现导航菜单的秘密 1 找到三角地带代码 function isInTriangle() { function a(a, b) { return (b.y - a.y) / (b.x - a.x) } 2 验证它的作用 验证普通的导航和牛X导航 #破解压缩和混淆 1、替换标识为无意义的标识符 2、替换数字为表达式,字符串为十六进制 3、去除注释 4、去掉空格空行 5、所有代码成为一行 6、把代码组装成为字符串,用Eval来解析 #破解压缩和混淆 1 用浏览器开发者工具破解压缩 用Chrome浏览器看百度的例子 2 解压缩的工具 把代码复制出来,到优才网解压缩 http://www.ucai.cn/tools/code Netbeans : Ctrl+Shit+F 1 破解混淆的第一个例子 破解关键点, 恢复代码 2 第二个例子 Eval函数 #编写高效的 JavaScript **语言本身的注意事项** 1 避免无意义的计算 2 尽可能减少计算 3 避免使用全局变量 4 始终声明局部变量、无意识的全局变量是灾难 4 如何检测isNaN 5 了解坑、多少种 false,with 慎用? 6 语句末最好加入分号 7 字符串拼接何为高效、没有固定范式 浏览器如何渲染 页面渲染就是浏览器将html代码根据CSS定义的规则显示在浏览器窗口中 的这个过程 得出三点CSS优化原则: A、CSS 放顶部 B、使用 Sprite 减少数据连接 C、JS 的DOM操作优化原则 #CSS渲染顺序 用一个例子来体验一下 1、渲染的顺序是从上到下 2、边下载边渲染 3、开启单独连接去取资源 4、后面的定义覆盖前面的 5、Reflow 和 Repaint #最大的性能问题,在于 DOM 操作 1 要使用高效的选择器 1 取 20000 次的对比 2 将选择器结果保存成为局部变量 1 取20000次的对比 3 先操作再显示(想想渲染原理) 4 先组装再附加到DOM上去 5 减少页面 DOM 节点数 6 将事件绑定与操作延迟