背景的 基本属性 background-color(背景颜色) background-image(背景图片) background-repeat(背景图片展示的方式) background-attachment(背景图片滚动还是固定) background-position(背景图片定位) 简写为： background: background-color background-image background-repeat background-attachment background-position 1、b…
在函数（类）的内部通过this(函数内部自带的一个变量)变量添加属性或者方法来实现对类添加属性或者方法。 通过this添加属性、方法是在当前对象上添加，JavaScript是一种基于原型prototype的语言，每创建一个对象时，都会有一个原型prototype用于指向它继承的属性、方法。 然而通过prototype继承的方法并不是对象本身的，在使用这些方法时，是通过prototype一层一层查找到的。 var book = function(id,bookname,price){ this.id = id; th…
原型模式 就是用原型实例指向创建对象的类，主要用于新的对象的类共享原型对象的属性以及方法。 简单实例： /** * 图片轮播类 */ var LoopImages = function(imgArr,container){ this.imagesArray = imgArr; this.container = container; } LoopImages.prototype = { //创建轮播图 createImage:function(){}, //切换图片 changeImage:function(){} …
结构型设计模式关注如何把类或者对象组合成为更大、更复杂的结构，简化设计。包含：外观模式、适配器模式、代理模式、装饰者模式、桥接模式、组合模式、享元模式 外观模式（套餐服务）Facade 为一组复杂的子系统接口提供一个更高级的统一接口，通过该接口对I系统接口的访问更容易。 例如： /** * 外观者模式 * @param {*} dom * @param {*} type * @param {*} fn */ function addEvent(dom,type,fn){ if (dom.addEventListen…
技巧型设计模式是I通过一些特定技巧来解释组件的某些问题。主要包含链模式、委托模式、数据模式、数据访问对象模式、节流模式、简单模板模式、惰性模式、参与者模式、等待者模式。 链模式 在对象方法中将当前对象返回，实现了对同一个对象多个方法链式调用。简化了在对对象多个方法的多次调用时，对该对象多次引用。在jQuery的使用中，链式调用是最平不过了。 /** * 链模式 * 元素获取的模式 * @param selector 选择符 * @param context 上下文 */ var Dom = function(sel…
指的是一类框架结构，通过提供一些子系统，指定它们的职责，并且将它们调理清晰组织在一起。主要包含了同步模块模式、异步模块模式、Widget模式、MVC模式、MVP模式、MVVM模式 模块化 把复杂的系统分解为高内聚、低耦合的模块，让系统开发变得可控、可维护、可拓展，提高模块的复用率。 同步模块模式（SMD） 请求发出以后，不论模式是否存在。立即执行后续的逻辑，实现模块开发中对模块的立即引用。 模块管理与创建方法 /*** * 同步模块模式 */ //定义模块管理单体对象 var F = F || {}; /** * …
let let命令用于声明变量，它声明的变量只在let命令所在的代码块有效。 let命令声明变量不存在变量提升的情况，var命令会存在变量提升的情况，就是在变量声明之前可以使用，值为undefined；let声明的变量一定在声明后使用，否则报错。 在块级作用域内存在let命令，那么它所声明的变量就只能在该作用域内有效。不受到外部影响。 let 不允许在同作用域声明同一个变量； const 声明一个只读的常量。声明变量必须初始化。 const pi = 3.1415; console.log(pi); //3.141…
浏览器的内核分成两个部分，一个渲染引擎，另一个是JS引擎。不同的浏览器的渲染引擎不同（不同的浏览的内核不同）。 浏览器工作的流程： 1）浏览器解析内容： HTML/SVG/XHTML，解析这三种文件会生成一个DOM Tree（DOM 树） CSS,解析CSS，产生了CSS规则树 JavaScript脚本，主要是通过DOM API和CSSOM API来操作DOM Tree和CSS Rule Tree。 2）解析结束后，浏览器引擎则通过DOM Tree 和CSS Rule Tree来构建Rendering Tree。 …
父元素没有固定宽高 水平垂直居中 html: <div class="wrapper"> <div class="info"> 垂直居中 </div> </div> css: //绝对定位水平垂直居中,方法1 .info { position: absolute; width: 500px; height: 300px; margin: auto; top: 0; left: 0; bottom: 0; right: 0; background-color: gree…
redux 仅仅是用来管理组件的状态，需要满足以下条件： 用户使用方式复杂 不同的用户、不同使用方式（普通用户和管理员）； 多个用户之间的协作； 与服务器有大量的交互； View有多个数据源。 其他场景下，能不用redux就不用，否则增加项目的复杂度。 三大特征： 单一的数据源，整个应用的state都存储与store对象中； state只读，只有触发Action（用于描述发生的事件）才能改变state； 使用纯函数（函数的返回值只能依赖于它的参数，相同的输入，只能得到相同的结果）执行修改。 由三个部分构成： 1. …
行为设计模式用于不同对象之间职责划分、算法抽象，包含：模板方法模式、观察者模式、状态模式、策略模式、职责链模式、命令模式、访问者模式、中介模式、备忘录模式、迭代器模式、解释器模式。 模板方法模式（Template Method） 在父类中定义操作算法骨架，把一些实现步骤延迟到子类中，让子类可以不修改父类的算法结构的同时能重新定义算法中某个实现步骤。 模板方法模式就是把很多个模型抽象化归一，从中抽象提取一个最基本的模板（该模板可以作为实体对象也可以作为抽象对象），其他模块只需继承该模板，拓展一些方法即可。 比如一个网…
1、使用Object.keys()遍历 const str={"name":"duxin","num":"253","index":"958"} Object.keys(str).forEach((key)=>{console.log(key)}) 2、for..in遍历 for(let i in str){ console.log(i+"===="+str[i]) } 3、Object.getOwnPropertyNames(obj) Object.getOwnPropertyNames(str).forE…
关于canvas是什么，这里就不再次描述了。这篇主要讲一下我在使用canvas的一个步骤： 1、获取canvas的对象：document.getElementById("canvas") 2、获取canvas的上下文环境：canvas.getContext("2d"); 先绘制一条直线： ctx.moveTo(x1,y1); ctx.lineTo(x2,x2); ctx.stroke(); // 连线 源码： <!DOCTYPE html> <html lang="en"> <head…
从事写代码这行业已经3年了，始终有一些困惑，我到底要不要坚持下去呢? 《程序员的思维修炼》里面有这样的一句话： 不管是否继续从事编程这个行业，今年我都需要做一些改变和调整了。
flutter组件的生命周期大致如下： createState：在Statefulwidget中创建State的方法，当Statefulwidget执行时会立即执行createState。 initState,初始化state的各个变量，同时也可以通过服务端获取数据后调用setState()来设置state。 didChangeDependencies，在该组件的state发生改变时，【state为全局，如主题、语言等等参数】； build：返回需要渲染的widget，因为build被执行多次，所以在build函数…
/* 时间戳转字符串 * timestamp 时间戳 * formart ："y-m":年和月之间的符号, * "m-d":月和日之间的符号 * "h-m":时和分之间的符号, * "m-s":分和秒之间的符号； * "m-a":是否显示上午和下午 */ class Utils { static String dateAndTimeToString(var timestamp, {Map<String, String> formart}) { if (timestamp == null || times…
dart使用List类来存放一个数组，如： List<int> list = [1,2,3,4]; list中存放不同的数据类型： List<dynamic> list = [1,2,45,"as"]; 或者是var list = [1,2,45,"as"]; List类封装了一些方法： list.add(); list.addAll(); 合并两个list list.insert(index,element); 在指定index处插入值 list.insertAll(inde…
Dart中内置了7类特殊的数据类型，分别为： numbers（数值类型） strings（字符串类型） booleans（布尔类型） lists（列表类型） maps（图类型） runes（字符类型） symbols（符号类型）
