自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(71)
  • 收藏
  • 关注

原创 git学习与使用

创建本地仓库mkdir learngitcd learngitgit init查看本地仓库当前状态git status这个命令会告诉你本地仓库的改动有哪些,哪些尚未提交到暂存区。提交到暂存区后再次git status就会告诉你哪些还没有提交到本地仓库。git diff查看修改了哪些地方,这个命令只能在尚未提交到缓存区的时候使用才能看到。查看commit历史记录git log这个命令可以

2017-06-07 11:54:45 439

转载 React vs Vue

上次更新博客是在5/24了。公司的工作也比较多所以就没有更新。今天看了一篇文章,讲的是React和Vue的区别。所以今天主要讲下这个。 文章传送门:React和Vue的书写特性差异渲染过程ReactReact的生命周期有以下几个方法: 1. componentWillMount: 这个方法会在组件的第一次渲染前调用。一个组件渲染只会调用一次该方法,除非重新生成组件。 2. componentD

2017-06-05 15:06:25 1363

原创 HTTPS详解

写在前面参考 https连接的前几毫秒发生了什么 HTTP与HTTPS的区别HTTPS概念HTTPS = HTTP + TLS 使用TLS对数据进行加密,但是数据传输依旧使用的是TCP。因此HTTPS作用有二:一是保护数据安全,二是通过证书验证网站的真实性。 HTTPS主要解决的问题是中间人攻击,中间人攻击一是可以窃取连接过程中的数据并篡改,二是可以欺骗客户端将数据包发往中间人处。 有了H

2017-05-24 20:41:46 1158

原创 代理模式

写在前面参考《JavaScript设计模式与实战》代理模式代理模式顾名思义就是为一个对象进行代理,对该对象的操作都会通过代理先去完成,达到为对象进行过滤保护等功能。保护代理通过代理,可以过滤掉一些不符合条件的操作,从而使得通过代理的那些操作可以操作对象。虚拟代理虚拟代理可以在真正需要某个东西的时候才去创建,这样可以减少不必要的开销。应用:图片预加载图片预加载图片在开始被加载到加载结束的过程中可能会有

2017-05-24 16:07:05 384

原创 Inline Vs Internal Vs External CSS(译)

写在前面原文地址:Inline Vs Internal Vs External CSS什么是CSS?几乎所有人都知道CSS的全称是 C ascading S tyle S heet。样式表是用于定义如何展示HTML元素的。CSS在HTML4.0就被用于解决设计上的问题,CSS无疑是实现设计者的设计中最好且最有用的。CSS的三种类型有下面这三种CSS样式:内联样式(inline css)内部样式

2017-05-23 20:43:32 2619 1

转载 JS中的Immutable

Persistent Data Structure(持久化数据结构) 也就是使用旧数据创建新数据时,要保证旧数据同时可用且不变。同时为了避免 deepCopy 把所有节点都复制一遍带来的性能损耗,Immutable 使用了 Structural Sharing(结构共享),即如果对象树中一个节点发生变化,只修改这个节点和受它影响的父节点,其它节点则进行共享。 Immutable 详解及 Reac

2017-05-23 15:17:13 1022

原创 React+Redux中的MVC

MVCMVC的框架大家都熟悉了 M(Model),数据模块,简单理解就是用于存储数据的 V(View),视图模块,管理展现给用户的页面视图 C(Controller),控制器模块,它控制数据流向模型对象,并在数据变化时更新视图。它使视图与模型分离开。 React+ReduxReact主要就是负责View的部分,其中通过props展示数据。 Redux里面主要包含一个store,这个stor

2017-05-22 23:20:06 3384

原创 二分查找

let arr = [1,2,4,5,6,10,23,45,67];function binarySearch(arr, value) { if(!(arr instanceof Array)) { return; } let left = 0, right = arr.length - 1; let index = Math.floor((left

2017-05-22 20:26:49 261

原创 发布-订阅模式(观察者模式)

写在前面参考文档《JavaScript设计模式与实战》发布-订阅模式光是看名字还是很好理解的,也就是在生活中,我们常常受到关于某品牌的活动消息(虽然大多数都是默认订阅),此时收到信息的我们就是订阅者,而品牌方则是发布者。 发布-订阅的模式也有很多好处:不需要我们每次都去询问活动什么时候举办。解耦的操作,品牌方不需要关心订阅者的其他消息,只需要按照名单发送短信即可。主要的内

2017-05-22 19:38:00 361

原创 Singleton单例模式详解

传送门: JavaScript设计模式详解-单身狗的你来看看单例模式单例模式单例模式就是在创建一个新的实例时,会首先判断先前是否存在该实例,不存在则创建一个新实例并返回,否则返回之前的实例。使用闭包实现单例模式为什么使用闭包?因为我们可以使用闭包来获取到当前实例的状态是已经创建还是尚未创建。 比如let getInstance = (function() { var instance = n

2017-05-22 11:26:06 409

原创 CSS:一个简单的loading动画

<div id="circle"></div><div id="inner"> <div id="spiner"></div> <div id="filler"></div> <div id="masker"></div></div>#inner { position: absolute; left: 24px; top: 24px; width: 100px;

2017-05-19 21:40:29 677

原创 vue+express:搭建个人博客(3)

这篇文章主要是对博客的一些逻辑呀样式呀还有跳转等问题进行修改。样式问题样式问题比较简单,主要都是input和textarea都会存在一个默认的选中框,以及router-link会存在默认下划线等。我的收藏收藏这个部分有点儿麻烦,主要是因为我点击收藏一次就要去修改一次数据库吗? 但是想链接那样先修改,点击保存后再保存到数据库的话,用户就要因为收藏多点击一次save按钮,还是很繁琐的。 思来想去我觉

2017-05-16 10:53:23 1758

原创 vue+express:搭建个人博客(2)

上次更到mutations和actions,今天继续写总览模块总览模块就是显示所有文章和链接,样式和上次分享的文章类似。我觉得没有添加一个返回按钮好不科学,于是我添加了一个。 大概的感觉就是这样。 遇到的问题就是 1. 使用getter获取划分好年份的数据,for item in obj此时item为obj中的一个值而非下标,所以需要另外存储一个数据去保存。 2. 返回使用的是this.

2017-05-14 17:57:52 3714

原创 vue+express:搭建个人博客(1)

最近正在看nodejs,在加上vue有不算很熟悉。 实践出真知,打算写个个人博客管理来练练手,当然,有参考。 一个 Vue.js+Node.js 的博客内容管理系统 会更新博文,主要记录一下自己搭建过程使用Vue-cli脚手架安装vue-clinpm install -g vue-cli搭建项目vue init webpack myBlog下面会有一系列的选择

2017-05-10 19:11:33 10161 6

转载 Nodejs:Passport验证用户名密码(不完全)

参考passport.js学习笔记什么是passportpassport是Nodejs的一个中间键,用于用户名和密码的验证登陆。在项目中我用它来验证后台用户名和密码,但passport更多用在第三方登录,功能强大。安装与配置本项目中使用了passport以及passport-localnpm install passport --savenpm install

2017-05-10 14:47:48 2649

原创 布局:理解BFC

写在前面昨天刚刚面试完,记起来被问到的一个问题。 存在两个左浮动元素,并且为它们设置左右margin,此时左边的浮动元素的右margin会和右边的左margin重合吗?当时就懵比了。但是我回答的是会。本能的认为。 然后又被问,那垂直设置margin呢?我回答也是会。 我们现在可以来看一下<div>float1</div><div>float2</div>div { float: le

2017-05-06 13:00:48 422

原创 深拷贝的实现

浅拷贝和深拷贝浅拷贝:拷贝的值为引用而非其真实值 深拷贝:拷贝的值为真实值而非引用。当拷贝的元素是对象是,深拷贝相当于会重新创建一个对象,并对对象的值一个一个复制过来,而不是仅仅获得该对象的引用值。为什么要分深浅拷贝显然,浅拷贝会带来一个很大的问题。就是,如果我复制的值是一个引用地址,那么我通过一个变量去修改这个对象,会导致所有该对象的引用都发生变化。slice/concat都是浅拷贝一个例子va

2017-05-03 15:12:45 4347

转载 Web缓存

参考【Web缓存机制系列】2 – Web浏览器的缓存机制 浏览器缓存机制剖析一张图说清缓存什么是web缓存web缓存是存在于客户端和服务端之间的资源,当下一个请求来到的时候,如果是相同的URL,缓存会根据缓存机制决定是直接使用副本响应访问请求,还是向源服务器再次发送请求。为什么要用web缓存降低了带宽。若每次都要重新向服务器去请求,那么就会浪费大量的带宽。但是有了web缓存,只会只用到少量的网

2017-05-03 14:11:29 296

原创 Vue:实现双向数据绑定

参考剖析Vue原理&实现双向绑定MVVM javascript实现数据双向绑定的三种方式Vue实现双向数据绑定的方式Vue是如何实现双向数据绑定的呢?答案是前端数据劫持。其通过Object.defineProperty()方法,这个方法可以设置getter和setter函数,在setter函数中,就可以监听到数据的变化,从而更新绑定的元素的值。实现对象属性变化绑定到UI大概的思路是: 1. 确定

2017-05-03 11:19:44 3398

转载 React:虚拟DOM

参考React虚拟DOM解析为什么需要虚拟DOM虚拟DOM减少了对DOM树的操作,如何减少? 通过batching和diff。batching批处理用于将所有的操作一次性交给DOM,diff则通过算法,比较前后差异进行DOM操作,有效降低DOM操作次数,以及操作范围。React渲染代价假设一个场景,有一个列表,现在要重新渲染它,并且渲染的数据与之前一模一样。 MVVM会如何做? MVVM监测数

2017-05-03 00:06:24 296

原创 面试题(十)

字符串的替换问题var str = 'my name is {$name}, I like {$hobby}';var obj = {name: '小红', hobby: '看电影'};//输出 my name is 小红, I like 看电影答案str.replace(/{\$(\w+)}/g, function(match, p1){ return obj[p1];})结果讨论

2017-05-02 15:10:56 367

原创 JS:事件循环机制、调用栈以及任务队列

写在前面js里的事件循环机制十分有趣。从很多面试题也可以看出来,考察简单的setTimeout也就是考察这个机制的。 在之前,我只是简单地认为由于函数执行很快,setTimeout执行时间即便为0也不会马上输出,而是等待函数执行完后再输出。这只对了一半。 实际上其运行机制就是js中的事件循环机制,在这个循环机制中呢,又与call Stack和task queue有关。我的参考参考了两篇文章,所以

2017-05-01 15:40:07 14818 1

原创 css3前缀

css3前缀是什么我们常常可以看到样式表中有很多属性的前缀,而这些属性正是css3的属性。由于css3较新(过去),因此很多属性尚未成为标准,被所有浏览器所接受。浏览器通过添加前缀的方式去测试css3属性,因此浏览器会通过前缀来识别是否是浏览器测试的属性。 css3前缀就是用来确保这种属性只在特定的浏览器渲染引擎下才能识别和生效。前缀有哪些-moz- /* 火狐等使用Mozilla浏览器引

2017-04-28 21:56:50 1096

原创 关于语法糖new

为什么说new是一颗语法糖呢? 因为其实在new的操作过程中,就是将改变了对象的_proto_属性以及对象的一些属性。这通过一个函数也可以做到,比如:var instance = function() { var temp = {}; temp._proto_ = subType.prototype; temp.id = 2017; temp.name = 'amy

2017-04-27 21:28:17 459

原创 js:赋值问题

var foo = {n: 1};var bar = foo;foo.x = foo = {n: 2};输出foo.xfoo.xundefined为什么呢? 先看前面两句var foo = {n: 1};var bar = foo;这两句的意思是定义了foo为一个对象,并且让bar指向这个对象。这很简单。foo.x = foo = {n: 2};//等价于foo.x = (foo =

2017-04-26 15:13:00 980

转载 js:this

这是一道面试题。 加上前些天看了几篇文章,有篇文章讲得不错,拿出来说说。 传送门:http://mp.weixin.qq.com/s/ksqtCd8ouxU-cVc_HnA4Aw函数调用函数调用的三种方式func(a, b);obj.method(a, b);func.call(context, a, b);似乎前两种我们更加频繁地使用,而第三种则不常用到。 但其实,第三种才是函数调用的真

2017-04-25 22:28:51 198

原创 关于Repaint(重绘)与Reflow(回流)

关于回流和重绘在刚开始学习前端时一般不会太在意,因为其影响的大多是运行时的性能问题。 显然,频繁地进行回流和重绘会导致运行性能的下降,所以,在要求性能的时候,往往要注意减少页面的回流和重绘。概念repaint重绘不会改变DOM的排版,仅仅改变某个元素的一些表现。比如,字体颜色的变化,背景颜色,透明度,输入框的值的改变等等。reflow回流这个相较于重绘的改动更大。当DOM的排版改变时,会触发重绘。

2017-04-24 23:57:49 622

转载 前端性能优化

http://www.haorooms.com/post/qianduan_xnyhbc

2017-04-21 14:55:30 275

原创 Vue.js+Vuex:一个简单的记事本

写在前面最近在学习vue,正好也在掘金看到一篇文章,是作者在学习vue的过程中实现的一个记事本应用。 这个想法真的很棒,因为记事本的功能并不多,逻辑也很简单,是一个学习vue的好例子。 于是我也跟风实现了一下,下面就讲一下我实现的过程和一些收获。UI先看下UI吧界面添加一篇记录点击一篇记录添加一篇记录为喜爱查看喜爱记录使用vue-cli构建项目这个项目是用脚手架构建的,有了脚手架,根本不需要自己

2017-04-20 22:53:21 3812 2

原创 关于SSH

SSH是一种网络协议,用于计算机之间的加密登录。使用SSH进行远程登录$ ssh user@host 使用SSH的风险使用SSH登录整个过程是这样的: (1)远程主机收到用户的登录请求,把自己的公钥发给用户。 (2)用户使用这个公钥,将登录密码加密后,发送回来。 (3)远程主机用自己的私钥,解密登录密码,如果密码正确,就同意用户登录。这个过程本身是安全的,但是实施的时候存在一个风险:如果有人截

2017-04-19 14:54:59 286

转载 破解前端面试(80% 应聘者不及格系列):从 DOM 说起(转载)

破解前端面试(80% 应聘者不及格系列):从 DOM 说起修改页面内容要求: 页面上有个空的无序列表节点,用 <ul></ul> 表示,要往列表中插入 3 个 <li>,每个列表项的文本内容是列表项的插入顺序,取值 1, 2, 3,怎么用原生的 JS 实现这个需求?同时约定,为方便获取节点引用,可以根据需要为 <ul> 节点加上 id 或者 class 属性。 我的做法是 html<ul id

2017-04-18 15:01:19 677

转载 关于闭包问题的多种方法

https://juejin.im/post/58f1fa6a44d904006cf25d22

2017-04-17 14:32:35 253

原创 ES6:箭头函数以及this

ES6的箭头函数应该是ES6标准里我接触比较多的,看过几篇文章,现在对箭头函数自己做一个总结。 阮一峰老师的ES6介绍里面的《函数的扩展》关于箭头函数的介绍,还是相当详细。 结合从 use strict 看 JS(一):this 与箭头函数一文,写写我关于箭头函数的理解。this的调用方式函数作为对象方法,在对象方法内使用thisvar obj = { name: 'objName'

2017-04-17 14:29:31 1106

转载 图片自适应问题

文章传送门:http://mp.weixin.qq.com/s/OMens6u_ePd0oDSQh-tnLA 主要是讨论如何使图片根据屏幕大小进行自适应。 下面是我的一些实践: HTML代码如下<body> <h4>图片自适应</h4> <img src="C:\Users\chen\Pictures\实训\捕获4.PNG" alt="img"></body>此时没有设置任何

2017-04-13 16:30:26 850

原创 面试题(九)

逻辑地址->物理地址进程控制块(PCB)PCB通常是系统内存占用区中的一个连续存区,它存放着操作系统用于描述进程情况及控制进程运行所需的全部信息,它使一个在多道程序环境下不能独立运行的程序成为一个能独立运行的基本单位或一个能与其他进程并发执行的进程。 一个进程只有一个PCB。缺页中断在请求分页系统中,可以通过查询页表中的状态位来确定所要访问的页面是否存在于内存中。每当所要访问的页面不在内存时,会产

2017-04-12 17:05:01 238

原创 面试题(八)

python面向对象 http://www.imooc.com/article/3066python内没有new关键字 python类方法的定义时第一个参数一定是self @classmethod是类方法,传入的参数一定有cls @property是对象属性的另一种定义方式,调用时不需要加上()。并且只有一个参数selfC++的构造函数和析构函数调用顺序 http://www.cnb

2017-04-10 22:22:17 262

原创 微信小程序初体验

最近参与到一个小程序的项目中,做最简单的写写页面啥的。 这次写的两个页面: 看页面就只知道实现起来其实并不难,但是这两个页面做起来还是涉及到一些比较陌生的地方。页面跳转并传递数据页面1点击某一项后会跳转到页面2。页面2要在title显示页面1点击的标题。这里涉及到了数据传递。 小程序里的数据传递跟get请求类似,就是将参数写入url中。所以我们只需要在点击时将点击的内容作为参数传递过去

2017-04-05 22:01:44 256

原创 ajax跨域请求

跨域问题 JS处于安全考虑使用了同源策略 Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web pages have the same origin. An origin is

2017-03-29 11:34:41 295

原创 Electron构建下载文件桌面应用

做这个真的要疯掉,但是开始了就要做出来。 下面就说一下整个过程吧,因为真的查阅了不少资料,发现似乎没几个桌面应用会选择做下载文件的,所以需要一直查资料查资料,查到要疯掉。 进入正题初识electronelectron文档:https://github.com/electron/electron 文档里面有中文的,所以还是蛮容易理解的。 文档主要就是介绍electron项目的结构如下:

2017-03-28 23:10:03 7827 6

原创 每天一篇面试题(七)

alert(0/0); // 输出NaNalert(1/0); // 输出Infinityalert(function(){alert("3333");}); // 将输出两次,第一次alert出3333,第二次alert出undefinedvar len = 4;while(len--){ setTimeout(function(){console.log(len)},300

2017-03-27 20:37:06 436

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

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