如何避免全局变量污染?
避免定义全局变量或全局函数用一个变量进行封装,并返回外部需要访问的接口如何写出高维护的js代码
配置数据和代码逻辑分离如:
改成:
---用js模板mustachehandlebarsjs
MVC的数据模式
model:数据层
view:用户表现层
controller:用户交互控制层
模块化开发
利用立即执行函数,可以在不暴露私有数据的情况下公开一些公共的接口
···
//全局变量jQuery和module2被传入module1中
var module1=(function($,module2){})(jQuery,module2);
···
尽量不适用全局变量,因为全局变量在整个生命周期中不会被释放确保解除不需要的事件监听
不要在闭包中返回外部不需要的对象
使用事件托管方式绑定事件
//获取父节点并添加一个click事件document.getElementById("list").addEventListener("click",function(e){//检查事件源元素if(e.target&&e.target.nodeName.toUpperCase=="LI"){//针对子元素的处理}})
常见的web前端攻击方式
XSS (Cross Site Scripting)跨站点脚本攻击,如:上述例子在chrome浏览器中会被拦截
总结:XSS攻击的特点就是:尽一切办法在目标网站上执行非目标网上原有的代码CSRF(Cross Site Request Forgery):跨站请求伪造
界面劫持
防范web前端攻击的最重要一个常识是:永远也不要轻易相信用户输入的数据。一定要针对用户输入做相关的格式过滤检查,防止任何可能的前端注入
更安全的使用Cookie移动web前端开发
使用流式布局借助css Media queries(媒体查询),如:使用响应式设计框架利用工具检查移动设备兼容性 如:
MobiReady
howtogomo
开发移动web端的准备工作
确定支持的移动设备处理和桌面端主网站的交互一些移动设备的开发库如下:
Mobile-Detect设置移动站点为单页模式不,避免 页面跳转,改成更友好的弹出层显示选择合适的移动前端框架,如:
jquerymobile
sencha touch
kendo
ionic
一些定义解释
作用域链:多个函数嵌套定义时,就会形成作用域包含的关系,这个关系称为作用域链,在内部函数内调用外部对象会降低性能