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秒的范围内被触发数千次。这可能会导致一些严重的性能问题,

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
{代码...}

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函数内部的每一个状态。

20170702-异步编程之 async await

2017-07-02
阅读 3 分钟
4.2k
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)页面元素

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

20170614-数组去重

2017-06-13
阅读 3 分钟
1.3k
测试用例 {代码...} indexOf {代码...} NaN丢失 {代码...} NaN重复 indexOf认为NaN与NaN是不重复的 includes {代码...} includes认为NaN和NaN是重复的 === {代码...} NaN重复 使用对象实现数组去重及改进 {代码...} 无法区分隐式类型转换成字符串后一样的值,比如1和'1' 无法处理复杂数据类型,比如对象(因为对象作为ke...

20170613-原生拖放

2017-06-13
阅读 3 分钟
1.9k
重点知识 拖放事件 拖动某元素时,会在被拖动元素上以此触发下列事件: dragstart:当拖拽元素开始被拖拽的时候触发的事件 drag:当拖拽元素的过程中一直触发的事件 dragend:当拖拽完成后触发的事件 当某个元素被拖放到一个有效的放置目标上时,放置目标上回依次触发下列事件: dragenter:当拖曳元素进入目标元素的时候触...

20170612-Event Loop

2017-06-12
阅读 1 分钟
1.3k
所有任务可以分成两种,一种是同步任务(synchronous),另一种是异步任务(asynchronous)。同步任务指的是,在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务;异步任务指的是,不进入主线程、而进入"任务队列"(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务...

20170611-事件

2017-06-11
阅读 3 分钟
1.2k
JavaScript与HTML之间的交互是通过事件实现的,事件,就是文档或者浏览器窗口中发生的一些特定的交互瞬间。可以使用监听器(或者处理程序)来预定事件,以便事件发生时执行相应的代码。

20170610-async、await与Promise

2017-06-10
阅读 4 分钟
3.1k
async和await async/await是一种编写异步代码的新方法,之前编写异步代码的方案是回调和promise async/await实际上是建立在promise的基础上,它不能与普通回调或者node回调一起用 async/await像promise一样,也是非阻塞的 async/await让异步代码看起来、表现起来更像同步代码,这正是其威力所在 语法(对比promise) 假设...

20170609-DOM相关属性和方法

2017-06-09
阅读 2 分钟
1.2k
Element: 父子元素节点属性: childElementCount:返回子元素节点的个数 children:返回当前元素的子元素节点的集合 firstElementChild:返回第一个子元素节点 lastElementChild:返回最后一个子元素节点 nextElementSibling:返回同级的下一个元素节点 previousElementSibling:返回同级的前一个元素节点 parentElement:返回...

20170609-DOM总结

2017-06-09
阅读 7 分钟
1.9k
文档节点(Document node)是每个文档的根节点(在浏览器中对应的是document),在这个例子中,文档节点有两个子节点,一个是<!DOCTYPE html>(DocumentTyep类型),另一个是<html>(Element类型)。文档元素是文档最外层的元素,文档中的其他所有元素都是包含在文档元素中。每个文档只能有一个文档元素,在HTML页面...