面向对象
关注
分享
扫一扫
weixin_42975115
这个作者很懒，什么都没留下…
展开
-
js 面向对象编程 第一天
初学者代码 有function checkName(){} 类似 var checkName = function(){} 以上的两个代码写法都差不多 缺点：如果别人写了的代码方法名跟你的一样，先写的方法会被覆盖掉 老手者代码-用对象收编变量 var checkobject ={ checkName:function(){}, checkEmai:function(){}, } 以上写...原创 2019-04-24 22:33:26 · 90 阅读 · 0 评论 -
js 面向对象设计模式--模板模式
//创建一个提示框类 let Alert = function (data) { //没有数据则返回，让后面的程序执行 if(!data) return; //设置内容 this.content = data.content; //创建提示框面板 this.panel = document.createElement('div'); ...原创 2019-05-31 09:08:26 · 228 阅读 · 0 评论 -
js 面向对象设计--组合模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>组合模式</title> </head> <body> <!--组合模式：整体模式,将对象树形结构来表示部分整体的层次结构--> <...原创 2019-05-28 20:23:47 · 199 阅读 · 0 评论 -
js 面向对象设计模式
观察者模式定义一种依赖关系，解决了主体对象与观察者之间功能的耦合 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>观察者模式</title> </head> <body> <div i...原创 2019-06-01 09:17:39 · 100 阅读 · 0 评论 -
js 面向对象设计模式
当一个对象的内部状态发生该改变时，会导致至行的改变，状态模式最终的母的及时简化分支判断流程 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>状态模式</title> </head> <body>...原创 2019-06-01 11:52:27 · 106 阅读 · 0 评论 -
js 面向对象设计--享元模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>享元模式</title> </head> <body> <div id="container"> </div> <p...原创 2019-05-29 15:16:16 · 183 阅读 · 0 评论 -
js 面向对象设计模式--策列模式
策列模式将一组算法封装起来使其相互之间可以替换。封装的算法具有独立性，不会随客户端变化而变化。 // //价格策列对象 // let PriceState = function () { // //内部双算法对象 // let stragtegy = { // //100返回30 // return30:function (price) { //...原创 2019-06-02 11:24:59 · 120 阅读 · 0 评论 -
js 面向对象设计模式--数据管理模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>数据管理</title> </head> <body> <script> /* * 本地存储类 * 参数 pre...原创 2019-06-08 12:55:54 · 236 阅读 · 0 评论 -
js 面向对象编程设计模式--命令模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>命令模式</title> </head> <style> #show div img{ width: 50%; ...原创 2019-06-03 09:27:10 · 133 阅读 · 0 评论 -
js 面向对象设计模式
// let a = function (type,fn) { // if(typeof fn ==="function") // return fn.call(this,type); // } // let result = a(1,function (type) { // return type; // }); // console.log(result); //访...原创 2019-06-03 17:47:02 · 335 阅读 · 0 评论 -
js 面向对象编程设计模式---中间者模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Mediator</title> </head> <body> <div id="one"> <b >hello w...原创 2019-06-04 08:35:02 · 162 阅读 · 0 评论 -
js面向对象设计模式---桥接模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>桥接模式</title> </head> <body> <!--在系统沿着多个多维变化的同时，又不增加其复杂度，并达到解耦--> &...原创 2019-05-27 21:03:34 · 120 阅读 · 0 评论 -
js 面向对象编程设计---装饰者模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!--//装饰者模式：在不改变原有对象的基础上，通过对其进行包装--> ...原创 2019-05-27 19:46:03 · 111 阅读 · 0 评论 -
js 面向对象编程 第二天
第一天有段代码 通过类的形式创建对象 var checkobject ={ this.checkName=function(){}; this.checkEmai= function(){}; } 通过this定义的方法 每通过 new 关键字创建对象时 新对象都会通过类对this 上的属性进行复制 这样 我们会造成不必要资源开销 所以...原创 2019-04-24 22:51:47 · 93 阅读 · 0 评论 -
js 面向对象设计模式--封装
每创建一个函数和或则对象都会创建一个原型对象prototype,在 prototype对象中又会像函数中创建this一样创建一个constructor 他用于指向拥有整个原型对象的函数或对象,通过new 该函数，对象会 继承该函数指针，此时会被定义为_proto_,通过它到公共容器（原型对象） 中匹配相应的属性和方法 <!DOCTYPE html> <html lang="en"...原创 2019-05-19 15:48:40 · 531 阅读 · 0 评论 -
js 面向对象设计模式 ---继承
//类式继承 // function Father(){ // this.fartherValue = true; // } // Father.prototype.getFartherValue = function () { // return this.fartherValue; // } // function Child(){ // this.childValue...原创 2019-05-20 21:05:53 · 425 阅读 · 0 评论 -
js 面向对象设计模式 --- 多态
//js 面向对象子多态 function Poly() { let arglen = arguments.length; zero=function () { console.log(0); } one=function () { console.log(1); } two=function () { console.log(2); } switch (arglen){ case 0: retu...原创 2019-05-20 21:18:47 · 137 阅读 · 0 评论 -
js 面向对设计模式 --简单工厂模式
//定义篮球类 let Baseketball = function(){ this.info = “篮球”; } Baseketball.prototype = { getRuler:function () { console.log(“篮球需要5个人”); } } //定义一个足球类 let Football = function(){ this.info = “足球”; } Football...原创 2019-05-21 08:41:18 · 123 阅读 · 0 评论 -
js 面向对象设计模式--原型继承模式
// //原型模式就是将原型对象指向创建对象的类 // //图片轮播图 // let LoopImages = function (imgArr,container) { // this.imgArry = imgArr;//轮播图 // this.container = container;//轮播图容器 // // } // LoopImages.prototype ={ //...原创 2019-05-24 14:44:02 · 116 阅读 · 0 评论 -
js 面向对象设计模式--单例设计模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="show"> hello world </div&g...原创 2019-05-24 15:59:06 · 141 阅读 · 0 评论 -
js面向对象设计模式---抽象工厂
let vehicleFactory = function (sub,sup) { if(typeof vehicleFactory[sup]==="function"){//判断该抽象方法是否创建 function F() {} F.prototype = new vehicleFactory[sup]();//继承父类属性方法 // co...原创 2019-05-21 13:35:13 · 125 阅读 · 0 评论 -
js 面向对象设计----外观者模式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="myinput"> hello </div&g...原创 2019-05-25 08:55:02 · 140 阅读 · 0 评论 -
js 面向对象设计模式--适配器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>适配器</title> <script src="http://code.jquery.com/jquery-1.8.3.min.js"></sc...原创 2019-05-25 09:58:59 · 121 阅读 · 0 评论 -
js面向对象编程设计模式----备忘录模式
let page = function () { //缓存 let cache ={}; //构造器 /** * 构造器 * 参数 page 请求的页数 * 参数 fn 数据获取成功执行的方法 * **/ return function (page,fn) { if(cache[page])...原创 2019-06-04 09:23:36 · 125 阅读 · 0 评论