08.设计模式，和ES6let

 

 

设计模式：

1.单例模式

2.观察模式

3.适配模式

ES6

 

------------------------------

1.单例模式

只能有一个实例 （比如只能调用一次）

var createWindow = (function(){
var div;
return function(){
if(!div){
div = docment.createELement("div");//原生JS 创建一个元素 IDV
div.innerHTML = "我是一个弹窗内容";
div.style.display = 'none';
document.body.appendchild(div);
}
return div;
}

})();

document.getElementById("btn").onclikc = function(){
//点击后先创建一个DIV
var win = createwindow();
win.style = display = 'block';
}

//一个方法 只调用一次只实例化一次

------------------------------

arguments !!!! 这个要会

2.观察者模式（订阅模式） !!!!

用个比方形容：比如京东某个商品没货了，然后收藏了，有货了后会通知订阅者。

//写公共方法

发布者：

订阅者：

var relgaseobj = {};//定义一个发布者
relgaseobj.list = [];//订阅消息添加进行缓存的处理
//增加订阅者
relgaseobj.listem = function(){
relgaseobj.list.push(fn);
};
//发布 消息
relgaseobj.trigger =function(){
for(var i=0,fn;fn=this.list[i++]; ){//fn 是function
fn.apply(this,arguments);//arguments 内置属性 获取当前所有参数
}
};
//订阅消息
relgaseobj.listem(function(name,coloe,size){//传的是 函数
conslole.log("姓名:"+name);
conslole.log("颜色:"+coloe);
conslole.log("尺码:"+size);
});//传的function
relgaseobj.trigger('shaozhu','红色','s');//传过去

//公共方法 用的比较多

------------------------------------------------------------

//观察者模式
var releaseObj = {};//定义发布者
releaseObj.list = []; //订阅消息添加
//增加订阅者
releaseObj.listen = function(fn){
releaseObj.list.push(fn);
};
//发布 消息
releaseObj.trigger = function() {
console.log(this.list);
for(var i=0,fn;fn=this.list[i++];){

fn.apply(this,arguments);
}
};
//订阅消息
releaseObj.listen(function(name,color,size){
console.log('姓名：'+name);
console.log('颜色：'+color);
console.log('尺码：'+size);
});
releaseObj.trigger('sonia','红色','s');
releaseObj.trigger('123','黑色','M');

------------------------------------------------------------

function aa(){
console.log(arguments)
}
aa(1,2,3,4,5,6,7,8,9);

arguments 就是获取当前函数 传入的集合

------------------------------------------------------------

适配器模式

自行车 适配电动车的 电驴 父类只声明 不实现 子类继承来实现

//适配器模式
//自行车 bike
//电动车 Ebike
//轮子 wheel
//电驱动 Edrive
//人驱动 Hdrive
//自行车 抽象类 便于功能扩展
var Bike = function() {

};
Bike.prototype.wheel= function() {
throw new Error("错误")
};
Bike.prototype.Hdrive= function() {
throw new Error("错误")
};
//电动车 抽象类 便于功能扩展
var Ebike = function() {

};
Ebike.prototype.wheel= function() {
throw new Error("错误")
};
Ebike.prototype.Edrive= function() {
throw new Error("错误")
};
//自行车的实现类
var RealizeBike = function() {
Bike.apply(this);
};
RealizeBike.prototype = new Bike();//继承
RealizeBike.prototype.wheel= function() {
console.log("我有二个轮子");
};
RealizeBike.prototype.Hdrive= function() {
console.log("人驱动");
};
//电行车的实现类
var RealizeEbike = function() {
Ebike.apply(this);
};
RealizeEbike.prototype = new Ebike();//继承
RealizeEbike.prototype.wheel= function() {
console.log("我有二个轮子");
};
RealizeEbike.prototype.Edrive= function() {
console.log("电驱动");
};
//自行车适配器
var BikeAdapter = function(o) {
Ebike.apply(this);
this.o = o;
};
BikeAdapter.prototype = new Ebike();//继承
BikeAdapter.prototype.Edrive= function() {
console.log(this.o);
console.log("电驱动");
};
var b1 = new RealizeBike();
//b1.Hdrive();
var e1 = new RealizeEbike();
//e1.Edrive();
//适配器自行车的行为
var aa = new BikeAdapter(b1);
aa.Edrive();

//抽象类里面的方法 子类必须要有

------------------------------------------------------------

ES6

ECMAScript 6 （js语言的标准 规范） js是它是实现

编写复杂大型的项目

let var

var 函数作用域 fun

let 块级作用域 {}

-----------

function a(){
if(true){
var str = "shaozhu";
}
console.log(str);
};
a();

shaozhu

-----------

function a(){
if(true){
let str = "shaozhu";
}
console.log(str);
};
a();

报错 因为 let 是块级作用域 在{}里面才可以用

要先定义才可以用

---------------------------------

let 变量不能重复声明一样的变量

let a=1;
let a=2;

报错

-------------------------------

箭头函数

变量名= 参数 =>函数体

var f = function(v){

return v
}

 

var f = v => v;

不传参

var f = () =>"123";

---------------------------

var f =(a1,a2,a3)=>a1+a2+a3;
f(5,5,5)
15

---------------------------
let a = (a1,a2,a3)=>a1+a2+a3

a(100,50,12)

162

---------------------------

MAP()

---------------------------

babel

-------------------------------------

 

-------------------------------------