- 博客(133)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 js深入之继承
关于原型、闭包、继承肯定是面试必问的，而了解、掌握、深入理解，这几点又完全不一样。所以上一篇我写了关于如何创建一个对象：工厂模式、构造函数模式、原型模式以及组合模式，寄生模式等等；并且又重新理解了一遍prototype和[[prototype]]（__proto__），这才算是真正的把这里理解清楚
2017-08-01 17:02:07
921
8
原创 js深入之创建对象
工厂模式创建function createPerson(name, age, job) { var o = new Object(); o.name = name; o.age = age; o.job = job; o.sayName = function() { console.log(thi
2017-07-31 09:42:17
398
原创 打个小广告吧——我的GitBooks
最近开始在想着把自己博客里面的东西整理整理写一本书。希望大家前来支持 地址在这里： https://daisyhawen.gitbooks.io/web-practice-book/content/
2017-02-24 16:25:58
1681
1
转载 Http和Https的区别
1.什么是HttpHttp中文叫做超文本传输协议, 它完成客户端到服务端等一系列运作流程1.1 与http关系密切的协议: IP, TCP和DNS负责传输的IP协议IP协议数据网络层, IP协议的作用是把各类数据包传送给对方. 而要确保确实传送到对方那里, 则需要满足各类条件. 其中两个重要的条件是IP地址和MAC地址.IP地址指明了节点被分配到的地址, MAC地址是指网卡所指的固定地址. IP地址
2017-02-23 16:01:51
586
原创 Javascript模块化编程——使用AMD，CommonJS，ES Harmony
定一个小目标，每周翻译一篇国外优秀博客 原文链接 https://addyosmani.com/writing-modular-js/模块化
2016-09-11 10:55:29
818
原创 javascript理解之变量作用域与闭包
何为闭包闭包是指能够访问自由变量的函数 (变量在本地使用，但在闭包中定义)。换句话说，定义在闭包中的函数可以“记忆”它被创建时候的环境。函数作用域与声明提前var scope= "global scope";function f(){ console.log(scope); //undefined，并没有出现"global scope" var scope="local scope";
2016-06-12 17:33:11
2652
2
原创 呕心沥血深入学正则和字符串
前言： 如果面试官问你exec与match的区别是什么，你应该怎么回答？ 这个是我前几天看到牛客网的一个面经，觉得很有意思的一个问题。正则是我们经常会使用的一个东西，我们可以用一行代码实现很多事情，从最简单的邮箱验证、手机号的验证，到进阶级别的字符串查找，字符串的替换等； 关于正则你真的懂了吗？正则类型在创建正则对象的时候有两种创建方式，字面量方式//方式一var
2017-09-02 11:41:04
745
1
原创 浅谈setTimeout,setInterval
概念setTimeoutsetTimeout的用法var timer1=scope.setTimeout(function,[delay,params]);var timer2=scope.setTimeout(code,[delay,params]);function function 是你想要在delay毫秒之后执行的函数。code 第二种语法,是指你想要在delay毫秒之后执行的代码
2017-08-28 10:37:11
776
转载 CSS实现垂直居中
方案一：line-height适用于单行文本， 居中前： <div class="vertical">居中元素</div>.vertical { height: 100px; line-height:100px; border: 1px solid red; }居中后： 说明：这种对于单行的文本很有效果
2017-08-24 11:17:12
770
原创 LeetCode_ 657. Judge Route Circle
题目： Initially, there is a Robot at position (0, 0). Given a sequence of its moves, judge if this robot makes a circle, which means it moves back to the original place.The move sequence is represented
2017-08-21 11:05:46
508
原创 LeetCode_461. Hamming Distance
/*The Hamming distance between two integers is the number of positions at which the corresponding bits are different.Given two integers x and y, calculate the Hamming distance.*/题目的意思是：找到x和y的二进制位中，不相同的
2017-08-21 10:44:56
393
原创 CSS之flexbox
一切能用css解决的问题都不要用js； 一直以来对css的关注就比较少，一篇写得很经典的flexbox的文章：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html总结： 在flexbox出现以前，我们的布局只能采用position+display+float属性来进行布局，下图列举了一些常见的布局： 前段时间总结了如何进行2列布局
2017-08-16 19:54:02
423
原创 js数据结构之链表
//定义节点function ListNode(val) { this.val = val; this.next = null;}//定义链表//链表中有头结点和一些方法function LinkedList() { this.head = new ListNode('head'); this.find = find; this.insert = in
2017-08-14 11:06:00
1089
原创 深入浅出es6之箭头函数
es6的函数es6函数的几个新特性：可以设置参数默认值可以结合解构赋值默认值使用利用rest（…变量名）传入任意参数… rest和扩展运算符rest参数（…变量名），用于获取函数的多余参数，rest参数搭配的变量是一个数组，该变量将多余的参数放入其中。1. 利用rest（…变量名）传入任意参数 var x = 1; function foo(...y) { co
2017-08-11 17:32:28
1105
原创 CSS布局
CSS的定位机制：普通流、浮动和绝对定位；普通流： 所谓普通流就是正常的布局，我们在页面中写了一个又一个的盒子，如果是块级元素，就每一块占一行，这样依次排列下来；如果是行类元素，那么就是一个一个的排列，直到一行占不下了，就排第二行。 浮动： 浮动就脱离了普通流的布局方式，它会主动去找一个框的边缘，然后去靠； 绝对定位： 绝对定位也是脱离了普通流的布局，它相对于最近的一个父元素进行定位；也可以设置
2017-08-09 16:57:13
559
原创 认认真真的探讨一下BFC
1、什么时候会出现BFC？浮动元素 float:left;表格元素：display:table;绝对定位元素：display:absolute/fixed行内元素:display:inline-block;overflow不为visible的值 overflow:hidden/scrollBFC的作用BFC的作用大着呢，BFC元素特性表现原则就是，内部子元素再怎么翻江倒海，翻云覆雨都不会
2017-08-03 17:05:19
442
转载 WEB APP、HYBRID APP与NATIVE APP的设计差异
一、Web App、Hybrid App、Native App 纵向对比首先，我们来看看什么是 Web App、Hybrid App、 Native App。Web APPWeb App 指采用Html5语言写出的App，不需要下载安装。类似于现在所说的轻应用。生存在浏览器中的应用，基本上可以说是触屏版的网页应用。优点（1）开发成本低， （2）更新快， （3）更新无需通知用户，不需要手动升级
2017-07-26 11:06:30
549
转载 前端性能优化（CSS动画篇）
啥是 Reflow 和 RepaintRepaintRepaint 就是「重绘」，它会在你改变 DOM 元素的视觉效果时进行，改变布局时不会触发。比如，opacity,background-color,visibility和outline等都会触发，「重绘」的开销还是比较昂贵的，因为浏览器会在某一个 DOM 元素的视觉效果改变后去 check 这个 DOM 元素内的所有节点。ReflowReflow
2017-07-26 10:48:15
537
原创 NodeJS之process对象
最近在看javacript异步教程这本书中看到了这么一行代码var fs = require('fs');process.chdir('./main/recipe');var concatenation = '';fs.readFileSync('.').filter(function(filename) { return fs.statSync(filename).isFile();
2017-07-26 10:40:01
771
原创 Web漏洞挖掘
写这篇文章不是为了去攻击其他的网站，只是为了重视web安全。Web安全的分类1. XSS攻击什么是XSS攻击xss攻击：cross-site scripting 故名思议，跨站点脚本注入。是指在一些页面通过注入一些script脚本或者actionScript脚本，而达到攻击的目的。XSS攻击的类型反射型XSS（非持久性XSS），通过注入一些脚本存储型XSS（持久型XSS），能存储在服务器端，比如
2017-07-14 17:47:03
4346
原创 跨域解决方案之postMessage
所谓跨域无外乎有几种： - 浏览器与服务器之间的跨域； - 页面和其打开的新窗口的数据传递 - 多窗口间的消息传递 - 页面和嵌套的iframe的消息传递这里我们只讲一种跨域解决方案postMessage，并讨论它的利弊。HTML5的出现，引入了很多新东西，比如前面介绍的web Worker，localstorage,sesionStorage,canvas…..但是这些的引入却也引入了大量
2017-07-13 11:52:49
2049
原创 异步的脚本加载
这里关系到浏览器性能的问题。 众所周知，如果吧script写在head中，那么文档需要等到head加载完毕才会显示出来。<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,
2017-07-11 09:22:19
295
原创 HTML5学习——worker对象
我的碎碎念，以前吧，觉得前端这玩意儿很复杂，有好多东西要学。后来学了一段时间之后发现不过如此，就是用html＋css写写页面，然后为了使页面有动态的数据，就加了ajax和js。然后不知道为什么前端越来越复杂。nodejs的出现之后，很多工具的出现，webpack、browserify…现在我用的是webpack。 之前觉得，天啊，这是要命啊，本来js就基础不扎实，又要整这些东西，然后后来发现，其实
2017-07-07 17:55:18
1097
原创 移动端开发-JqueryMobile实战（一）
又来写一篇教程，是因为最近在图书馆看到了一本书《jQuery移动Web开发》，因为以前没有怎么关注过移动端的开发，于是就把jQuery Mobile看了一下，并想根据书中最后一节讲的创建一个RSS阅读器应用程序。看看途中会不会遇到什么坑。 index.html页面，没什么可说的，感觉jQuery Mobile的样式还挺好看的，使用data-role来指定page，header，content<!D
2017-07-07 17:23:56
5004
原创 理解jQuery中的Promise
首先回顾一下jQuery的deferred对象： jQuery的deferred对象关于Promise的进化史在jQuery1.4中，还没有promise这个概念，写一个ajax，就得写回调函数，就像这样：$.get('/myData', { success: onSuccess, failure: onFailure, always: onAlways})到了jQuer
2017-06-27 14:27:29
5133
原创 《javascript语言精粹》读书笔记——函数
这几天发现了一本好书，又薄又精辟，《JavaScript语言精粹》 看了对象、函数这两节，发现书如其名，确实是精粹。函数的调用函数调用的方式有四种： - 方法调用模式 - 函数调用模式 - 构造器调用模式 - apply调用模式方法调用模式这个方法是经常会见到的一种模式，方法作为对象的一种属性，通过obj.functionName()这种调用方式调用，如：var myObject = {
2017-06-05 10:48:28
502
原创 用vue-cli 与vuex一步一步搭建一个笔记应用(四)
讲了这么久，终于讲到重点了。将vuex用进我们的笔记应用项目首先建立一个文件夹用来放vuex吧按照那篇博文的写法，一个store.js 和 actions.js再想一下一个笔记应用需要哪些数据呢？ 1、笔记数据 2、以及当前活动的笔记数据（即正在编辑的笔记）好像就只有这个数据了吧。对于笔记也就只有增删查改，以及设置当前编辑笔记和喜欢的笔记了 这里是store.js的代码，我现在尽量代码风格都偏
2017-05-13 18:34:52
2585
原创 用vue-cli 与vuex一步一步搭建一个笔记应用(三)
前面我们仅仅只是搭建了一个简单的界面，并没有使用vuex来进行数据管理。 下面我们开始怎么使用vuex，因为我也是初学，所以一边学一边写吧。 vuex有中文文档：其实讲得很清除 https://vuex.vuejs.org/zh-cn第一步 安装vuexcnpm install vuex -g --save-dev 为什么要使用vuex?在vuex文档里写得很清楚，一个vue就是这样的，有dat
2017-05-10 16:50:27
5871
原创 用vue-cli 与vuex一步一步搭建一个笔记应用(二)
上一篇，我们已经借助vue-cli把环境搭建好了，这一篇就开始介绍如何写笔记应用的界面了。我们借鉴的博文划分得很清楚因此在components中建立三个组件。toolbar.vue，noteList.vue ,Editor.vue再提一句vue-cli采用的es6语法。 因此它的模块化语句就是：export default { name: 'hello', data () { re
2017-05-09 15:13:21
4643
原创 深入学习前端MVC和MVVM（二）
上一节说了后台的MVC，现在开始讲重点，前端的MVC又是一个什么鬼。 很长一段时间我都没有搞清楚MVC和MVVM。 一直在说ng是MVC，react和Vue是MVVM，MVVM我用过了，用过vue和react，他们的数据绑定，那么MVC究竟是什么样子呢？一个简单MVC的实现有一篇很好的文章讲了MVC： http://www.imooc.com/article/4911重点： MVC的基础是观
2017-05-09 08:44:06
1411
原创 深入学习前端MVC和MVVM（一）
MVC是一种开发模式，就是一种模型—视图—控制器（MVC）模式。 在php项目中，nodejs项目中，很容易实现MVC。比如一个nodeJS的MVC：先说后台的MVC一、model层模型层：模型中的逻辑严重依赖持久性。 这里用的是mongoose来定义模型。 其实模型层就是对数据的封装，下面是我的model.jsvar mongoose=require('mongoose');var Ord
2017-05-08 20:44:23
3843
原创 关于HTTP缓存
鉴于面试总是被问到这个问题，而且之前也是懂得大概，因此查看了MDN、阅读了《HTTP权威指南》，以及一些好的博客，这可能是我写得最全面的HTTP缓存了吧。Cache-Control和Expire以前一直以为只有浏览器可以设置cache-control，然而并不是：Cache-Control可以通过设置max-age值来指定缓存的有效期（单位：秒）。Cache-Control: max-age=315
2017-05-08 17:35:45
410
原创 js性能优化之惰性加载函数
一个普通的浏览器嗅探技术，每次都要调用addEvent进行判断，执行if语句。// 浏览器嗅探技术：指的就是检测浏览器是否支持var addEvent = function(elem, type, handler) { if (window.addEventListener) { return elem.addEventListener(type, handler, fal
2017-04-26 11:33:22
2280
1
原创 js性能优化之分时函数
分时函数和函数节流的问题不一样，函数节流针对的事件不是用户主动调用的，前面已经提过了。 函数节流的原理是：延迟当前函数的执行，如果该次延迟还没有完成，那么忽略接下来该函数的请求。也就是说会忽略掉很多函数请求。分时函数处理的问题是用户主动调用的，比如插入千百个节点var arr = [];for (var i = 1; i <= 1000; i++) { arr.push(i) //假设a
2017-04-25 16:05:35
2640
原创 js性能优化之函数节流
最近在看一些书的时候，以及面试题的时候看到一个新词“函数节流” 函数节流的场景出现在，Js中很多函数的触发并不是用户直接控制的，在这些情况下，函数可能会被非常频繁的调用，而造成大的性能问题。函数被频繁调用的场景window.onresize事件。mouseover事件上传进度 函数节流的原理比如我们在window.onresize事件中要打印当前浏览器窗口的大小，在我们通过拖拽来改变窗口
2017-04-25 11:42:34
3036
转载 jsonp跨域的安全问题
JSONP没有关于错误调用的处理，一旦回调函数失败，浏览器就会以静默失败的方式处理。只支持GET请求安全性问题1、Callback可自定义导致的安全问题Content-type与XSS漏洞 再输出 JSON 时，没有严格定义好 Content-Type（ Content-Type: application/json ）然后加上 callback 这个输出点没有进行过滤直接导致了一个典型的 X
2017-04-24 09:40:12
8765
1
原创 面试积累——BFC
什么是BFCBFC就是“块级格式化上下文”的意思，创建了 BFC的元素就是一个独立的盒子，不过只有Block-level box可以参与创建BFC， 它规定了内部的Block-level Box如何布局，并且与这个独立盒子里的布局不受外部影响，当然它也不会影响到外面的元素。BFC有一下特性：内部的Box会在垂直方向，从顶部开始一个接一个地放置。Box垂直方向的距离由margin决定。属于同一个B
2017-04-12 18:26:11
1624
1
原创 RequireJS源码解读（二）
（续上节） 上面讲了如何处理全局序列和context化全局序列 以及执行全局序列中的依赖项。 检查依赖项 //Mark all the dependencies as needing to be loaded. context.nextTick(function() { //Some defines c
2017-03-24 17:02:04
521
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人