深入浅出Redux-----react-redux

前言本文不会拿redux、react-redux等一些react的名词去讲解,然后把各自用法举例说明,这样其实对一些react新手或者不太熟悉redux模式的开发人员不够友好,他们并不知道这样使用的原因。本文通过一个简单的例子展开,一点点自己去实现一个redux+react-redux,让大家充分...

2018-05-21 16:04:28

阅读数 489

评论数 0

JavaScript设计模式-----发布订阅模式

1.发布订阅模式的定义:发布订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生变化时,所有依赖于他的对象都将得到通知。2.发布订阅模式的通用实现:3.一个真实的例子:ajax异步请求获取用户的登陆信息后,渲染到各个板块,使用这个模式可以解耦合,各个模块自行订阅登陆成功...

2018-04-15 10:58:25

阅读数 44

评论数 0

前端HTML5-----Doctype

HTML中 的Doctype 关于IE浏览器的文档模式,浏览器模式,严格模式,怪异模式 对文档进行有效性验证: 它告诉用户代理和校验器这个文档是按照什么DTD 写的。这个动作是被动的,每次页面加载时,浏览器并不会下载DTD 并检查合法性,只有当手动校验页面时才启用。 决定浏览...

2018-08-20 10:49:04

阅读数 40

评论数 0

浏览器渲染原理

浏览器工作大流程:   1)浏览器会解析三个东西: 一个是HTML/SVG/XHTML,事实上,Webkit有三个C++的类对应这三类文档。解析这三种文件会产生一个DOM Tree。 CSS,解析CSS会产生CSS规则树。 Javascript,脚本,主要是通过DOM API和CSSOM...

2018-08-19 09:58:04

阅读数 102

评论数 0

JavaScript底层-----深拷贝与浅拷贝

【JS】深拷贝与浅拷贝的区别,实现深拷贝的几种方法 如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力。 此篇文章中也会简单阐述到栈堆,基本数据类型与引用数据类型,因为这些概念能...

2018-07-23 17:26:32

阅读数 163

评论数 0

前端之HTML5-----拖拽

1.浏览器支持:Internet Explorer 9 、Firefox、Opera 12、chrome、Safari52.拖拽API的相关函数:被拖动的源对象可以触发的事件:1.ondragstart:源对象开始被拖动2.ondrag: 源对象被拖动过程中(鼠标可能在移动也可能未移动)3.ond...

2018-07-06 13:41:46

阅读数 340

评论数 0

前端之HTML5-----音频和视频

1.HTML5简介:新特性:用于绘画的canvas元素用于媒介回放的video和audio元素对本地离线储存的更好支持新的特殊内容元素比如article、footer、header、nav、section新的表单控件,比如calendar、data、time、email、url、search浏览器...

2018-07-05 14:39:57

阅读数 518

评论数 0

前端面试-----HTTP协议

HTTP协议的主要特点:简单快速,灵活,无连接,无状态HTTP报文的组成部分:请求报文:请求行:请求方法  URL地址  协议名称或版本号                 请求头:   键值对  服务端据此获取客户端的信息                 空行:      分隔请求头和请求体   ...

2018-06-19 11:15:26

阅读数 210

评论数 0

前端面试-----DOM事件类

DOM事件的级别:DOM0 : element.onclick = function(){}DOM2 : element.addEventListener('click', function(){}, false)DOM3 : element.addEventListener('keyup', f...

2018-06-17 22:05:16

阅读数 125

评论数 0

前端面试-----CSS盒模型

标准模型和IE模型:box-sizing: content-box  标准模型box-sizing: border-box  IE模型JS如何设置获取盒模型对应的宽和高:内敛属性:dom.style.width.height获取渲染后的属性:dom.currentStyle.width/heigh...

2018-06-17 21:17:42

阅读数 161

评论数 0

前端面试-----页面布局

题目:假设高度已知,请写出三栏布局,其中左栏,右栏宽度各为300px,中间自适应:1.浮动解决方案:2.绝对定位解决方案:3.flexbox解决方案:4.表格布局:5.网格布局:他们的优缺点分析:浮动布局: 脱离文档流但兼容性好绝对定位: 脱离文档流导致子元素也脱离文档流但快捷flex布局: 较完...

2018-06-16 10:38:29

阅读数 362

评论数 0

前端布局-----Grid布局

1.什么是网格:1.固定的位置和弹性的轨道的大小:可以使用固定的轨道尺寸创建网格,比如使用像素单位,也可以使用比如百分比或者专门为此目的创建的新单位fr来创建弹性尺寸的网格。2.元素位置:可使用行号行名来标定一个网格区域来精确定位元素2.网格容器:我们通过在元素上声明display: grid或者...

2018-06-15 10:37:34

阅读数 180

评论数 0

前端布局-----flex布局

1.flex布局是什么:flex布局意为弹性布局,用来为盒模型提供最大的灵活性,任何一个容器都可以指定为flex布局。设为flex布局后,子元素的float,clear,vertical-align属性将失效2.容器的属性:1.flex-direction:决定主轴的方向2.flex-wrap属性...

2018-06-14 21:44:07

阅读数 179

评论数 0

编码规范-----react

基本规范原则上每个文件只写一个组件, 多个无状态组件可以放在单个文件中. eslint: react/no-multi-comp.推荐使用 JSX 语法编写 React 组件, 而不是 React.createElement创建组件的三种方式Class vs React.createClass v...

2018-05-26 13:58:06

阅读数 166

评论数 0

前端框架之React-----CSS Module

在react开发中会遇到一系列css的相关问题:1.全局污染:css使用全局选择器的机制来设置样式,样式可能被错误覆盖2.命名混乱:为了避免全局污染,为了避免样式冲突,容易使命名混乱3.依赖管理不彻底:组件应该相互独立,引入一个组件应该只引入它所需要的css4.无法共享变量:复杂组件要使用Java...

2018-05-25 16:00:12

阅读数 143

评论数 0

前端框架之React-----事件系统

1.事件委派:react不是把事件函数绑定到真实的节点上,而是把所有事件绑定到结构的最外层,使用一个统一的监听器,这个事件监听器上维持了一个映射来保持组件内部的事件监听和处理函数。当组件挂载或卸载时,只是在这个统一的事件监听器上插入或删除一些对象,当事件发生时,首先被这个统一的事件监听器处理,然后...

2018-05-25 11:05:42

阅读数 85

评论数 0

JavaScript性能优化-----循环性能

1.减少对象成员及数组项的查找次数:只查找一次属性,并把值存储到一个局部变量,然后在控制条件中使用这个变量2.颠倒数组的顺序提高性能:通常数组项的顺序与所执行的任务无关,可以从最后一项开始处理。3.减少迭代次数: Duffs Device循环体展开技术,减少迭代次数能获得更加显著的性能提升...

2018-05-13 11:06:36

阅读数 94

评论数 0

JavaScript设计模式-----模板方法模式

1.模板方法模式的定义和组成:假如我们有一些平行的子类,各个子类之间有一些相同的行为,也有一些不同的行为,如果相同和不同的行为都混合在各个子类的实现中,说明这些相同的行为会在各个子类中重复出现。但实际上,相同的行为可以被搬移到另一个单一的地方,模板方法模式就是为了解决这个问题而生的,在模板方法模式...

2018-05-12 16:08:36

阅读数 33

评论数 0

深入浅出Redux

1.redux第一原则:所有在应用中的改变,包括数据和UI状态都包含在单一的对象里,我们把他称为状态或者状态树2.redux第二原则:状态树是只读的,你不能修改或者对他进行写入操作,唯一能改变树的方式就是分发一个动作,一个动作就是一个普通的JavaScript对象,他以最简单的方式描绘了应用里面发...

2018-05-12 14:15:28

阅读数 58

评论数 0

JavaScript设计模式-----组合模式

1.组合模式的定义:组合模式就是用小的子对象来构建更大的对象,而这些小的对象本身也许是由更小的”孙对象“构成2.组合模式的用途:组合模式将对象组合成树形结构,以表示”部分-整体“的层次结构。除了用来表示树形结构之外,组合模式的另一个好处是通过对象的多态性表示,使得用户对单个对象和组合对象的使用具有...

2018-05-05 14:16:18

阅读数 67

评论数 0

提示
确定要删除当前文章?
取消 删除
关闭
关闭