单例模式
var obj1 ={
name:"Lily",
age:18
}
var obj2 ={
name:"LiHua",
age:24
}
类似于上述这样的,把对象的属性写在一起,用大括号括起来,就是普通的单例模式
高级单例模式
let myFunctions = (function(){
let name = "Lily",
age = 18;
function fn1(){};
function fn2(){};
return {
fn1:fn1,
fn2:fn2
}
})();
自执行函数执行,返回了一个对象,是引用数据类型,被外界的myFunctions接收,所以自执行函数执行时形成的私有作用域不被销毁,里面的变量都被保存了下来。
用一个变量myFunctions接收这个对象,如果想调用myFunctions里面的方法,直接成员访问即可。
比如想要调用myFunctions里面的fn1方法:
myFunctions.fn1(); 这样即可调用fn1方法
同样的,在自己写的代码中,有哪些想要被外界调用的,也可以通过 return 返回,给到 myFunctions 这个对象里面,供外界调用
高级单例模式的作用:
可以让自己代码不受外界代码的干扰,尤其是多个人一起做同一个项目的时候,防止自己的代码被污染,也防止自己的代码覆盖其他人的代码。
而且如果其他人想要使用你写的方法,也可以调用,直接像上述那样成员访问即可。
惰性思想
案例说明
提出需求:手写获取元素的CSS的方法:
1、getComputedStyle(ele,null)[attr]
2、ele.currentStyle[attr] 兼容ie6--ie8
提示:通过in这个方法可以判断某个对象是否包含某个属性
语法:[属性] in 对象
如果返回值是 true ,说明这个对象包含这个属性,如果是false,说明无
function getCss(ele,attr){
if("getComputedStyle" in window){
return getComputedStyle(ele)[attr];
}else{
return ele.currentStyle[attr];
}
}
var box = document.getElementById("box");
var res = getCss(box,"width");
console.log(res);
分析: 上述方法可以实现对应的功能,但是性能不太好,每次执行这个方法时,都需要做一次判断,才能获取属性,可以采用惰性思想,优化这个方法
惰性思想优化
function getCss(ele,attr){
if("getComputedStyle" in window){
getCss = function(ele,attr){
return window.getComputedStyle(ele)[attr];
};
}else{
getCss = function(ele,attr){
return ele.currentStyle[attr];
};
}
return getCss(ele,attr);
}
var box = document.getElementById("box");
getCss(box,"width");
getCss(box,"height");
getCss(box,"margin");
...
改善以后达到的效果:这样只需要判断一次浏览器的版本,之后再次调用则无需再次判断浏览器的版本,直接调用相应方法了,可以节约性能,这就是惰性思想。
惰性思想: 执行过一遍的东西,如果第二遍执行还是一样的效果,则我们就不想让其重复执行第二遍了
利用闭包的思想,做完判断以后直接重构函数,getCss是全局变量,将重构的函数给了这个变量,而且最后返回的时候直接执行了,后面再次调用的时候就不需要再次判断了 直接执行那个重构以后的方法了。
这样一来,第一次执行getCss的时候,重构了函数,该函数是在这个私有作用域里面创建的,被全局变量getCss接收了,所以第一次执行这个方法的时候,作用域不销毁。
简单来讲,本例中,经过判断以后,重构了一下函数,把重构以后的函数在返回时执行,将执行完的返回结果返回,这样一来,就算是第一次执行也可以得到想要的结果,并且重构了以后,再次执行时不需要再做判断了。
如有错误,欢迎指正,共同进步~