博客
关于我
js高阶编程之---单例模式,XHR兼容 (惰性思想)
阅读量:647 次
发布时间:2019-03-15

本文共 1435 字,大约阅读时间需要 4 分钟。

高级JS编程中的惰性思想:能一次性完成的任务,不需要多次执行。

项目中的单例模式(惰性思想_案例1)

在实际项目开发中,惰性思想能够显著提升效率。以下是一个典型案例:获取CSS属性值的方法。

var utils = (function() {    var flag = 'getComputedStyle' in window;    function getCss(attr) {        var val = null, reg = null;        if (flag) {            val = window.getComputedStyle(this, null)[attr];        } else {            if (attr === 'opacity') {                val = this.currentStyle['filter'];                reg = /^alpha\(opacity=(\d+(?:\.\d+)?)\)$/;                val = reg.test(val) ? reg.exec(val)[1]/100 : 1;            } else {                val = this.currentStyle[attr];            }        }        reg = /^(-?\d+(\.\d+)?)((px|pt|em|rem)?$/);        return reg.test(val) ? parseFloat(val) : val;    }    return {getCSS: getCSS};})();

应用场景:

  • 该方法用于获取元素的CSS属性值。
  • 在标准浏览器中,使用getComputedStyle
  • 在IE6-8中,则需要额外处理opacity属性,并通过正则表达式转换filter值。

调用示例:

utils.getCSS.call(curEle, 'width');

惰性思想_案例2

在实际开发中,好多方法需要逐次尝试才能找出最终可用的版本。以下是一个典型案例:创建AJAX对象的兼容性处理。

function createXHR() {    var xhr = null,        flag = false,        ary = [            function(){return new XMLHttpRequest();},            function(){return new ActiveXObject('Microsoft.XMLHTTP');},            function(){return new ActiveXObject('Msxml2.XMLHTTP');},            function(){return new ActiveXObject('Msxml3.XMLHTTP');}        ];    for (var i=0; i

核心思想:

  • 这种懒初始化方式,能够在出现错误时,自动尝试下一个候选方案。
  • 一旦找到可行的方法,就立即固定到createXHR,避免重复判断。

这样的方法在处理浏览器兼容问题时,能够显著降低调试成本和开发复杂度。

转载地址:http://laymz.baihongyu.com/

你可能感兴趣的文章
剑指Offer03-数组中重复的数字
查看>>
将windows里的内容直接复制粘贴到ubuntu,提高效率
查看>>
将tomcat设置成window自启动服务
查看>>
17蓝桥试题之承压计算
查看>>
webservice 远程服务器返回错误:(400)错误的请求
查看>>
给JS对象添加扩展方法
查看>>
bat中rar压缩命令
查看>>
[日常] PHP与Mysql测试kill慢查询并检验PDO的错误模式
查看>>
[PHP] 控制反转依赖注入的日常使用
查看>>
[PHP] try catch在日常中的使用
查看>>
[Linux] 进程间通信
查看>>
[PHP] error_reporting(0)可以屏蔽Fatal error错误
查看>>
[PHP] 解决php中上传大文件的错误
查看>>
[Git] 彻底删除github上的某个文件以及他的提交历史
查看>>
[Go] gin框架渲染html字符串
查看>>
[操作系统]内存连续分配管理方式
查看>>
[Go] json.Unmarshal()解析后存储的结构体定义
查看>>
superset报错
查看>>
C++ Primer Plus【复习笔记】-【复合类型】
查看>>
使用Spring AOP应该注意的一个小细节
查看>>