前言 本篇博文出至于我的github仓库:web-study,如果你觉得对你有帮助欢迎star,你们的点赞是我持续更新的动力,谢谢! 异步编程在前端开发中尤为常见,从最早的XHR,到后来的各种封装ajax,再到DOM事件触发的回调,无不涉及异步编程.今天咱们来聊聊ES6中新提出的异步解决方案:Promise和async/await. Promise的原理和基本用法 Promise的原理 Promise 是一种对异步操作的封装,可以通过独立的接口添加在异步操作执行成功.失败时执行的方法.主流的规范

不经意间看了你一眼(阮一峰的es6读后感)我自己常用的 字符串篇:ES6 为字符串添加了遍历器接口(详见<Iterator>一章),使得字符串可以被for...of循环遍历.只要有遍历器接口的都可以用es6 的for of去遍历代替es5的forEach 和 for...in 这里就得引导出forin for of区别 魔板字符串,includes 函数篇: 箭头函数 ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面.一看就知道这个参数是不是必传的了 function log(x,

参考: ECMAScript6入门 就是随便看看,了解一下. 一.ECMAScript6简介 1. 什么是ECMAScript6? JavaScript语言的下一代标准.2015年6月发布,正式名称是<ECMAScript2015标准>. 思考:编程语言和英语.法语语言差不多吧.其实就是语言的标准.规范之类,和英语语法差不多的东西吧 = =! 二.let和const命令 1. let 1.1 声明的变量仅在块级作用域内有效 1.2 不存在变量提升 1.3 暂时性死区:使用let命令声明变量之前

es5 构造函数 实例: function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')'; }; var p = new Point(1, 2); 作为对象的模板,通过class关键字,可以定义类,相当于创建一个 实例 //定义类 class Point { constructor(x, y) {

1.扩展运算符 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 该运算符主要用于函数调用. function add(x, y) { return x + y; } const numbers = [4, 38]; add(...numbers) 替代函数的apply方法 // ES5 的写法 Math.max.apply(null, [1

ES6(阮一峰)学习总结   1.块级作用域的引入 在ES6之前,js只有全局作用域和函数作用域,ES6中let关键字为其引入了块级作用域. { var a = 5; let b = 6; } console.log(a); //5 console.log(b); //b is undefined let声明的变量只能在其所在的代码块内才能访问,var声明的变量由于是全局变量,因此可以在代码块外访问 2.暂时性死区 var声明的变量可以在声明之前使用,相当于默认为其声明其值为undefined了

鉴于最近用 vuejs 框架开发项目,其中有很多涉及到 es6 语法不太理解所以便认真地读了一下这本书. 地址:http://es6.ruanyifeng.com/#README 第一章:let ,const 命令以及块级作用域 es6 新增了 let 和 const 这两个变量的声明关键字,这样大大的强化了 js 变量的合理程度以及修补了很多es6 版本前出现的bug.他们有着以下的特性:  一:let 的声明 1.1 用let 声明的变量会将变量绑定到声明时所属的语句块中,并且语句块外部不可

  鉴于最近用 vuejs 框架开发项目,其中有很多涉及到 es6 语法不太理解所以便认真地读了一下这本书. 地址:http://es6.ruanyifeng.com/#README 第一章:let ,const 命令以及块级作用域 es6 新增了 let 和 const 这两个变量的声明关键字,这样大大的强化了 js 变量的合理程度以及修补了很多es6 版本前出现的bug.他们有着以下的特性:   一:let 的声明  1.1 用let 声明的变量会将变量绑定到声明时所属的语句块中,并且语句块

es6 一经推出,Promise 就一直被大家所关注.那么,为什么 Promise 会被大家这样关注呢?答案很简单,Promise 优化了回调函数的用法,让原本需要纵向一层一层嵌套的回调函数实现了横向的调用,也就是链式调用. 我们先来看下面的代码: function getData(){ setTimeout(()=>{ var name = "zhangsan"; }, 1000) } getData(); 在上面的代码中,我们模拟了一个异步时间,一秒后输出 name = &q

最近正在学习阮一峰老师的es6(第三版)教材,在学到第七章<函数的扩展>中的箭头函数嵌套时,文中提到了一个关于“管道机制”的示例,文中源代码如下: //es6(第三版)教材中的管道机制源代码: const pipeline = (...funcs) => val => funcs.reduce((a, b) => b(a), val); const plus1 = a => a + 1; const mult2 = a => a * 2; const addThe

阮一峰 ES6:http://es6.ruanyifeng.com/#docs/module

1.Promise (名字含义:promise为承诺,表示其他手段无法改变) Promise 对象代表一个异步操作,其不受外界影响,有三种状态: Pending(进行中.未完成的) Resolved(已完成,又称 Fulfilled) Rejected(已失败) promises的优势 1.解决回调地狱 2.更好地进行错误捕获 有时我们要进行一些相互间有依赖关系的异步操作,比如有多个请求,后一个的请求需要上一次请求的返回结果.过去常规做法只能 callback 层层嵌套,但嵌套层数过多的话就会有

测试框架 Mocha 实例教程   作者: 阮一峰 日期: 2015年12月 3日 Mocha(发音"摩卡")诞生于2011年,是现在最流行的JavaScript测试框架之一,在浏览器和Node环境都可以使用. 所谓"测试框架",就是运行测试的工具.通过它,可以为JavaScript应用添加测试,从而保证代码的质量. 本文全面介绍如何使用Mocha,让你轻松上手.如果你以前对测试一无所知,本文也可以当作JavaScript单元测试入门.值得说明的是,除了Mocha以

读阮一峰<ECMAScript 6 入门>小结,http://es6.ruanyifeng.com/ 1. ES6简介 Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码 在线转换:https://babeljs.io/repl/ 2. let和const命令 let在块级作用域内有效,var有变量提升(变量可以在声明之前使用,值为undefined),声明的变量有内存泄露 const定义常量,不能改变 如果区块中存在let和const命令,这个区块对这些命令

前言 在最近的项目中,用到了es6的promise语法,发现promise.prototype.catch 并不只是单单reject抛出的回调函数,所以今天做一些笔录,防止以后在项目中又碰到这样的问题. 先介绍一下promise.prototype.catch Promise.prototype.catch 方法是 .then(null, rejection) 或是 .then(undefined, rejection)的别名,用于指定发生错误时的回调函数. 如果Promise 对象状态变为re

声明:转载自阮一峰的网络日志 这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代码,相信很多人都见过. <script src="1.js"></script>

-  转自阮一峰老师博客 React 入门实例教程   作者: 阮一峰 日期: 2015年3月31日 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月

首先上交阮一峰老师的github地址,一共有15个demo,我们一个一个的进行分析,结合上文所学的知识! 其中有一些内容,我做了修改,我是先看一遍然后从新敲了一遍. https://github.com/ruanyf/webpack-demos 准备工作 首先还是安装,不过这一次,我们进行全局安装. $ npm i -g webpack webpack-dev-server webpack-cli 克隆仓库地址 git clone https://github.com/ruanyf/webpac

http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_two_async_operations.html Redux 入门教程(二):中间件与异步操作   作者: 阮一峰 日期: 2016年9月20日 上一篇文章,我介绍了 Redux 的基本做法:用户发出 Action,Reducer 函数算出新的 State,View 重新渲染. 但是,一个关键问题没有解决:异步操作怎么办?Action 发出以后,Reducer 立即算出 Sta

业务场景描述 大家都通过互联网投递过简历,比如在智联.58.猎聘等平台.投递心仪的职位前一般都需要前提创建一份简历,简历编辑界面常规的布局最上面是用户的个人基本信息,如姓名.性别.年龄.名族等,接着是用户的工作履历.项目经验.培训经历.擅长技能等详细信息.布局的结尾或首部都会有保存按钮,方便用户一键保存填写的信息. 假如此业务利用vue开发,可以将个人基本信息.项目经验.擅长技能 各自做成一个独立的单文件组件,组件内自己进行数据的获取和保存操作,最后将这些组件组合到一起形成一个简历编辑页面,在编

indexedDB IndexedDB 是一种底层 API,用于在客户端存储大量的结构化数据,它可以被网页脚本创建和操作. IndexedDB 允许储存大量数据,提供查找接口,还能建立索引,这些都是 LocalStorage 所不具备的. 就数据库类型而言,IndexedDB 不属于关系型数据库(不支持 SQL 查询语句),更接近 NoSQL 数据库. 其他的介绍就不搬运了,大家可以自行百度,后面有参考资料. 需求 我想更好的实现文档驱动的想法,发现需要实现前端存储的功能,于是打算采用 Inde