webpack打包结果说明

2017-12-15
阅读 4 分钟
3.6k
打包入口 {代码...} 模块1 {代码...} 模块2 {代码...} 打包结果 打包结果是一个立即执行函数表达式 {代码...}

前端面试总结

2017-12-13
阅读 1 分钟
2.6k
数组的几个方法对比闭包作用域this原型与原型链、继承的介绍事件冒泡与捕获(IE6只支持事件冒泡不支持事件捕获,如何在IE6上实现事件捕获)JavaScript 运行机制 Event-LooprequestAnimationFrameAjaxsessionStorage localStorage

函数防抖与函数节流

2017-12-12
阅读 2 分钟
4.9k
有一些浏览器事件可以在很短的事件内快速触发多次,例如 调整窗口大小 或 向下滚动 页面。例如,如果将事件监听器绑定到窗口滚动事件上,并且用户继续非常快速地向下滚动页面,你的事件可能会在3秒的范围内被触发数千次。这可能会导致一些严重的性能问题,

20170814-React

2017-08-14
阅读 2 分钟
1.6k
在Web开发中,要将更新的数据实时反映到UI上,就不可避免地需要对DOM进行操作,而复杂频繁的DOM操作通常是产生性能瓶颈的原因之一。为此,React引入了Virtual DOM机制。Virtual DOM实际上是在浏览器端用JavaScript实现的一套DOM API,它包括:

20170812-XSS跨站脚本攻击

2017-08-13
阅读 2 分钟
3.3k
XSS 跨站脚本攻击(Cross Site Scripting),为了不和层叠样式表(Cascading Style Sheets,CSS)缩写混淆, 所以将跨站脚本攻击缩写为XSS。 XSS是攻击者在web页面插入恶意的代码。当用户浏览该页面时,代码执行,从而实现攻击目的。对受害用户可能采取Cookie资料窃取、会话劫持、钓鱼欺骗等各种攻击

20170811-fetch

2017-08-11
阅读 1 分钟
1.8k
Fetch API提供了一个fetch()方法,它被定义在BOM的window对象中,你可以用它来发起HTTP请求。 该方法返回的是一个Promise对象,让你能够对请求的返回结果进行处理(通过then方法进行连续调用,减少嵌套。ES6的Promise在成为标准之后,会越来越方便开发人员;fetch api与XMLHttpRequest相比,更加简洁,资源获取方式比ajax...

20170810-web性能优化

2017-08-10
阅读 1 分钟
1.7k
Web性能优化 脚本的加载与执行 1.在</body>闭合标签之前,将所有的<script>标签放到页面底部,这能确保在脚本执行前页面已经完成了渲染 在JavaScript文件的下载、执行过程中,页面的渲染和用户交互会被阻塞 现代浏览器可以并行下载JavaScript文件,但是JavaScript文件的下载仍然会阻塞其他类型资源的下载 如...

20170809-从URL输入到页面展现

2017-08-10
阅读 3 分钟
4.8k
从URL输入到页面展现 1.输入URL URL:统一资源定位符,是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示。 URL包含以下几部分:协议、服务器名称(或IP地址)、路径、参数和查询。 举例说明: 常用协议: 协议 中文名称 默认端口号 http 超文本传输协议 80 https 用安全套接字层传送的超文本传输协议 443 ftp...

20170808 - 跨浏览器的事件兼容处理程序

2017-08-08
阅读 2 分钟
1.2k
{代码...}

20170808- css 居中

2017-08-08
阅读 2 分钟
1.4k
水平居中 行内或类行内元素水平居中 在块级父容器中设置text-align:center 块级元素水平居中 块级元素设置margin-left和margin-right为auto(前提是已经为元素设置了width) flex布局实现(多个水平排列元素)水平居中 {代码...} flex布局实现(多个垂直排列元素)水平居中 {代码...} 绝对定位实现水平居中 {代码...} 垂...

20170723-Ubuntu配置rsync服务

2017-07-23
阅读 2 分钟
7.6k
简介 rsync(remote synchronize)是类unix系统下的实现远程数据同步功能的工具,它的特性如下: 可以镜像保存整个目录树和文件系统 可以很容易做到保持原来文件的权限、事件、软硬链接等信息 无需特殊权限即可安装 快速:第一次同步时 rsync 会复制全部内容,但在下一次只传输修改过的文件。rsync 在传输数据的过程中可以...

20170721-src和href的区别

2017-07-21
阅读 1 分钟
3.7k
href(超文本链接)属性指明了一个网络资源的位置,并定义了当前元素(例如一个a标签)或者当前文档(例如一个link标签)和这个网络资源的关系。

20170718-各种排序方法

2017-07-18
阅读 3 分钟
1.4k
1.插入排序 {代码...} 插入排序是稳定的排序方法 时间复杂度 O(n²) 2.冒泡排序 {代码...} 插入排序是稳定的排序方法 时间复杂度 O(n²) 3.快速排序 {代码...} 插入排序是不稳定的排序方法 时间复杂度 O(nlogn) 4.选择排序 简单选择排序 {代码...} 这种简单选择排序是稳定的排序方法 时间复杂度 O(n²) 堆排序 {代码...} 堆...

20170710-Generator

2017-07-10
阅读 2 分钟
1.8k
Generator函数是ES 6提供的一种异步编程解决方案。从语法上,可以将Generator函数理解为一个状态机,它封装了多个内部状态。执行Generator函数会返回一个遍历器对象,也就是说Generator函数除了是一个状态机,还是一个遍历器对象生成函数。返回的遍历器对象,可以依次遍历Generator函数内部的每一个状态。

20170707-Node.js、npm安装、服务器简单功能的实现、相关Linux命令

2017-07-09
阅读 2 分钟
3.2k
最近在搭建自己的网站,需要在服务器(Ubuntu系统)上安装Node.js相关的内容,这篇博客就记录一下Node.js的安装、服务器简单功能的实现、以及用到的一些`Linux命令

20170702-异步编程之 async await

2017-07-02
阅读 3 分钟
4.3k
async函数返回一个 Promise 实例,可以使用then方法(为返回的Promise实例)添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。

20170702-异步编程之Promise

2017-07-02
阅读 4 分钟
5.1k
1.Promise的含义 Promise是异步编程的一种解决方案 Promise实例代表一个异步操作,从它可以获取异步操作的消息 Promise实例有三种状态: Pending:进行中 Resolved:已完成 Rejected:已失败 Promise实例的状态只能由 Pending->Resolved, Pending->Rejected。一旦Promise实例的状态发生改变,就不会再发生变化,...

20170629-重排与重绘

2017-06-29
阅读 2 分钟
2.1k
DOM树中的每一个需要显示的节点在渲染树中至少存在一个对应的节点(隐藏的DOM元素在渲染树中没有对应的节点)。渲染树中的节点被称为“帧”或者“盒子”,理解页面元素为一个具有填充(padding)、边距(margin)、边框(border)和位置(position)的盒子。一旦DOM树和渲染树构建完成,浏览器就开始显示(绘制 paint)页面元素

20170628-Cookie与Session

2017-06-28
阅读 2 分钟
1.4k
这里的无状态是指服务器不知道客户端是什么状态,每一个请求都是独立的。但是HTTP的无状态特性严重阻碍了交互式应用程序的实现,因为交互是需要承前启后的,例如一个购物车程序需要知道用户之前选择了什么东西。于是,两种用于保持HTTP状态的技术就应运而生了,一个是Cookie,另一个是Session

20170627-HTTP与浏览器缓存机制

2017-06-27
阅读 4 分钟
4.5k
浏览器缓存机制 Expires策略 Expires是web服务器响应消息头字段,在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存读取数据,而无需再次请求。 Web服务器告诉浏览器在GMT(格林尼治时间):Tue,27 Jun 2017 02:15:13之前,可以使用缓存文件。 Expires是HTTP 1.0定义的内容,现在大多数浏览器默认使用HTTP...

20170626-Promise的实现

2017-06-26
阅读 1 分钟
1.5k
Promise的实现 {代码...} 测试 {代码...}

20170625-bind方法的实现

2017-06-25
阅读 2 分钟
2.1k
通过上面的例子,可以看到通过new方式调用temp方法和用new方式调用Person方法的结果是一致的,那么这种情况该如何实现呢?下面的方法是《JavaScript Web Application》一书中对bind()的实现:通过设置一个中转构造函数F,使绑定后的函数与调用bind()的函数处于同一原型链上,用new操作符调用绑定后的函数,返回的对象也...

20170623-CommonJS AMD CMD

2017-06-23
阅读 4 分钟
2.8k
模块化开发:随着浏览器性能的提升,相关技术的进步,前端项目变得越来越复杂。为了提高开发效率,人们将特定功能的方法/代码放在一起,构成模块,方便在开发过程中复用,但是出现了很多问题:全局变量的使用冲突,函数命名冲突,依赖关系管理困难。为了解决上述问题,制定了一些方法和规范来解决上述问题——CommonJS、AM...

20170622-webpack之plugin篇

2017-06-22
阅读 2 分钟
3.7k
如果项目中需要使用jQuery类似的工具,难道需要在每一个文件中都加入require('jquery')吗?使用webpack.ProvidePlugin,可以使jquery变成全局变量,这样在项目的任何地方都可以直接使用

20170622-webpack之loader篇

2017-06-22
阅读 2 分钟
2.8k
less-loader 处理代码中引入的less文件,通过对应的less模块,将less转变为css css-loader 通过css-loader,使得在css中能够使用@import和url(...)的方式实现require()的功能 style-loader style-loader将所有计算后的样式加入页面中(将样式表嵌入webpack打包后的JS文件中即css和js会被打包到同一个文件中) babel-loader...

20170621-jQuery总体结构分析

2017-06-21
阅读 2 分钟
1.5k
通常我们创建一个对象或实例的方式是在运算符new后紧跟一个构造函数,但是如果构造函数有返回值,运算符new所创建的对象就会被丢弃,返回值将作为new表达式的值。

20170620-Storage

2017-06-20
阅读 2 分钟
1.4k
Web Storage的目的是克服由cookie带来的一些限制,当数据需要被严格控制在客户端上时,无需持续地将数据发回服务器。Web Storage的两个主要目标是:

20170618-cookie

2017-06-19
阅读 5 分钟
1.8k
HTTP Cookie, 通常直接叫做cookie,最初是在客户端用于存储会话信息的。该标准要求服务器对任意HTTP请求发送Set-Cookie HTTP头作为响应的一部分,其中包含会话信息。这个HTTP响应设置一个以name为名称、以value为值的cookie,名称和值在传送时都必须是URI编码的。浏览器会存储这样的会话信息,并在这之后,通过为每个请...

20170616-跨域

2017-06-16
阅读 6 分钟
6.7k
同源策略 浏览器出于安全方面的考虑,不同源的客户端脚本在没有明确授权的情况下,不能读写对方的资源。 同源指的是: 同协议 同域名 同端口 作用:保证用户信息的安全,防止恶意的网站窃取数据 例1:A网站是一家银行,用户登录以后,又去浏览其他网站。如果其他网站可以读取A网站的 Cookie,会发生什么?很显然,如果 C...

20170615-Ajax和XMLHttpRequest

2017-06-15
阅读 5 分钟
1.6k
Ajax:"Asynchronous JavaScript And XML"即异步JavaScript和XML,是一种创建交互式网页应用的网页开发技术,这项技术的核心是浏览器提供的XMLHttpRequest对象。