系列文章 -- ES6笔记系列 接触过Ajax请求的会遇到过异步调用的问题,为了保证调用顺序的正确性,一般我们会在回调函数中调用,也有用到一些新的解决方案如Promise相关的技术. 在异步编程中,还有一种常用的解决方案,它就是Generator生成器函数.顾名思义,它是一个生成器,它也是一个状态机,内部拥有值及相关的状态,生成器返回一个迭代器Iterator对象,我们可以通过这个迭代器,手动地遍历相关的值.状态,保证正确的执行顺序. 一.简单使用 1. 声明 Generator的声明方式类似一…

ES6,即ECMAScript 6.0,ES6的第一个版本是在2015年发布的,所以又称作ECMAScript 2015 如今距ES6发布已经一年多的时间,这时候才去学,作为一个JSer,羞愧羞愧,还是尽早去学习吧 主要参照阮一峰的 ES6标准入门 及其他资料,系统地学习ES6,好记星不如烂笔头,记录一下成文 以下为系列文章 ES6笔记(1)-- 环境配置支持  ES6笔记(2)-- let的块级作用域  ES6笔记(3)-- 解构赋值  ES6笔记(4)-- Symbol类型  ES6笔记(5…

系列文章 -- ES6笔记系列 虽然ES6已经发布一年多了,但在各大浏览器之中的支持度还不是很理想,在这查看ES6新特性支持度 Chrome的最新版本浏览器大部分已经支持,在Node.js环境上支持度更好一些,可原生使用,但实际上更多的做法是用其他工具将ES6转码成支持度更好的ES5 这些工具有babel转码器.traceur转码器 等,用得最多的应该是babel 一.Babel环境的配置 Babel用于将ES6语法转换成ES5语法,例如 /* ES6 */ var arr = [1, 2, 3…

系列文章 -- ES6笔记系列 一.函数级作用域 我们都知道,在ES6以前,JS只有函数级作用域,没有块级作用域这个概念 没有块级作用域,有利有弊,利于方便自由,弊于作用域内的变量容易被共享,例如这个例子 var a = []; for (var i = 1; i <= 10; ++i) { a[i] = function() { return i; }; } a[3]() 循环中变量i是处于全局作用域下的,其实这里是个闭包,函数内部的i与函数外的i形成了引用的关系,导致函数退出之后i未被销毁,…

系列文章 -- ES6笔记系列 解构赋值,即对某种结构进行解析,然后将解析出来的值赋值给相关的变量,常见的有数组.对象.字符串的解构赋值等 一.数组的解构赋值 function ids() { return [1, 2, 3]; } var [id1, id2, id3] = ids(); console.log(id1, id2, id3); // 1 2 3 如上,解析返回的数组,取出值并赋给相应的变量,这就是解构赋值 1. 还可以嵌套多层,只要相应的模式匹配了就能解析出来 var [a,…

系列文章 -- ES6笔记系列 Symbol是什么?中文意思是标志.记号,顾名思义,它可以用了做记号. 是的,它是一种标记的方法,被ES6引入作为一种新的数据类型,表示独一无二的值. 由此,JS的数据类型多了一位成员: Number.String.Boolean.undefined.Object.Symbol 一.简单使用 1. 声明 类似字符串String的声明方式 var str = 'str'; Symbol的声明方式类似,它调用构造函数Symbol() var s = Symbol();…

系列文章 -- ES6笔记系列 搞ES6的人也是够无聊,把JS弄得越来越像Java.C++,连Iterator迭代器.Set集合.Map结构都出来了,不知道说什么好... 一.简单使用 1. iterator 学过C++的人应该知道这是个迭代器对象,拥有一个指针,指向数据结构中的某个成员 JS中的iterator也有类似的功能,JS内部为一些数据结构实现了iterator迭代器的接口,让我们可以方便的使用 var [a, b, ...c] = [1, 2, 3, 4]; c // [3, 4]…

系列文章 -- ES6笔记系列 很久很久以前,在做Node.js聊天室,使用MongoDB数据服务的时候就遇到了多重回调嵌套导致代码混乱的问题. JS异步编程有利有弊,Promise的出现,改善了这一格局,让异步编程表现出类似“同步式代码”的形式,更好地体现了它的价值. 一.基本概念 1. Promises/A+规范 Promise是一种异步编程的解决方案,本质来说其实它是一种规范,Promises/A+规范 根据规范的定义,一个Promise对象应该至少有以下的基本特点 三个状态 Promis…

ES6 笔记汇总 二.ES6基础-let和const命令 三.变量的解构赋值 四.字符串的拓展 五.正则表达式的拓展 ...将会持续更新,敬请期待…

ES6笔记2 Promise Promise 是 ES6 引入的异步编程的新解决方案,语法上是一个构造函数 一共有3种状态,pending(进行中).fulfilled(已成功)和rejected(已失败) 特点:只有异步操作可以决定当前处于的状态,并且任何其他操作无法改变这个状态: const promise = new Promise((resolve, reject) => { if (success) { resolve(value); // 成功 } else { reject(err…

ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会,英文名称是European Computer Manufacturers Association)通过ECMA-262标准化的脚本程序设计语言.这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,但实际上后两者是ECMA-262标准的实现和扩展.ECMAScript 6.0(以下简称ES6)是JavaScript语言的下一代标准,已经在2015年6月正式发布了.它的目标,是使得JavaScript语言…

原文链接:http://dmitrysoshnikov.com/ 原文作者:Dmitry Soshnikov 译者做了少量补充.这样的的文字是译者加的,可以选择忽略. 作者微博:@Bosn 在这个简短的笔记中我们聊一聊ES6的又一特性:带默认值的函数参数.正如我们即将看到的,有些较为微妙的CASE. ES5及以下手动处理默认值 在ES6默认值特性出现前,手动处理默认值有几种方式: function log(message, level) { level = level || 'warning';…

块级作用域 ES5没有块级作用域,只有全局作用域和函数作用域,由于这一点,变量的作用域甚广,所以一进入函数就要马上将它创建出来.这就造成了所谓的变量提升. ES5的"变量提升"这一特性往往一不小心就会造成一下错误: 内层变量覆盖外层变量 var tmp = new Date(); function f() { console.log(tmp); if (false) { //执行则undefined var tmp = "hello world"; } } 变量泄露…

1.箭头函数 箭头函数里的this会引用 定义 箭头函数时,外部作用域 的 this .箭头函数只是 引用 外部作用域的 this ,本身不存在 this.同时因为没有 this ,所以 无法用new生成实例,例: var name = 'window'; function test(){ //实际等同于这样 //var _this = this; this.name = 1; this.method = ()=>{ //console.log(_this.name); console.log(…

遍历数组: 1:传统的 for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);} 2 内建的 forEach 方法 myArray.forEach(function (value) { console.log(value);  //value不是下标而是数组内容}); 但是此方法不能使用 break 语句中断循环,也不能使用 return 语句返回到外层函数. 3:for-in 循环…

RegExp构造函数 在ES5中,RegExp构造函数的参数有两种情况. 第一种情况是,参数是字符串,这时第二个参数表示正则表达式的修饰符(flag). var regex = new RegExp('xyz', 'i'); // 等价于 var regex = /xyz/i; 第二种情况是,参数是一个正则表示式,这时会返回一个原有正则表达式的拷贝. var regex = new RegExp(/xyz/i); // 等价于 var regex = /xyz/i; 但是,ES5不允许此时使用第…

字符串检索方法,indexOf(searchValue,fromIndex)//参数1必需,检索查询的字符串或者值,参数2选题,规定检索的起始位置,不设置默认从0开始 indexOf()方法返回检索字符串出现的位置,如果没有出现检索的字符串或者值,返回-1 'Hello Tom'.indexOf('o',2)//4,出现'Hello Tom'.indexOf('e',3)//-1,未出现 ES6新增加字符串检索方法 includes():返回布尔值,表示是否找到了参数字符串. startsWit…

1.查找关键字  includes(); 返回布尔值 //①:includes -->代替-->indexof-->返回布尔值 var str = "769909303"; console.log(str.indexOf("9")); console.log(str.includes("9"));//true 2. 重复字符 repeat(); //②:repeat -->重复 console.log('meow'.rep…

特性介绍 箭头函数是ES6新增的特性之一,它为JS这门语言提供了一种全新的书写函数的语法. //ES5 function fun(x,y){ return x+y; } console.log(fun(5,10));//15 //ES6 var fun6 = (x,y) => {return x+y;} console.log(fun6(6,10)); ES6简化了声明函数,不需要再写 function . 好像除了简化代码,并没有什么新奇的对不对,那我们往下慢慢看. —————————————…

一.Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map). if(1){ let list = document.querySelectorAll('ul.fancy li'); Array.from(list).forEach(function (li) { console.log(li); }); } 上面代码中,querySelecto…

一.destructuring ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构Destructuring. //es5 if(1){ let cat = 'ken'; let dog = 'lili'; let zoo = {cat: cat, dog: dog}; console.log(zoo) ; //Object {cat: "ken", dog: "lili"} } //用ES6完全可以像下面这么写: if(1){ let ca…

一.set 1.基本用法 数据结构Set类似于数组,但是成员的值都是唯一的,没有重复的值. let s = new Set(); [2,3,5,4,5,2,2].map(x => s.add(x)) for (let i of s) {console.log(i)}// 2 3 5 4 //Set函数可以接受一个数组作为参数,用来初始化. var items = new Set([1,2,3,4,5,5,5,5]); console.log(items); // set object conso…

ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类. 部分来自JavaScript ES6 class指南.mozilla https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Classes 1.定义类 让我们回想一下在ES5中定义一个类的方式.通过不是很常用的Object.defineProperty方法,我可以定义一些只读的属性. function…

一.字符串的扩展1. 用于从码点返回到对应字符. String.fromCodePoint(xx)2. for...of可以遍历字符串3. includes():返回布尔值,表示是否找到了参数字符串.    startsWith():返回布尔值,表示参数字符串是否在原字符串的头部.    endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部. (第一个参数:要搜索的目标字符,第二个参数:开始搜索的位置) (endsWith的行为与其他两个方法有所不同.它针对前n个字符,而其他两个…

变量 1. let 和 const 声明的变量不在window上了 2. es6中对于块级作用域里的函数声明实现不统一,要避免在大括号里声明函数,尽量用函数表达式来替代. 3. let和const声明的变量有暂时性死区 解构赋值 1. 解构赋值的本质是模式匹配,冒号左侧是模式,冒号右侧才是要赋值的变量.没有冒号的写法是冒号左右相同时的简写版本. 2. 解构赋值可以有默认值 3. 想跳过可以用逗号[, b, c] = [1, 2, 3] 4. 函数的传参括号其实就相当于一个隐形的数组解构赋值,va…

/** * Created by Administrator on 2017/4/13. */ /*---------------------Es6编码规范---------------------*/ //1.块级作用域 //let 取代 var //在全局环境,不应该设置变量,只应设置常量 const优于let. const a='1'; const b='1'; { let a='2'; let b='3'; } //2.静态字符串一律使用单引号或反引号,不使用双引号.动态字符串使用反引号…

概要 js中的数组.对象,加上ES6中增加的Map.Set四种数据集合. Iterator提供了一种机制,为各种不同的数据结构提供统一的访问机制.任何数据结构只要部署Iterator接口,就可以完成遍历操作.(依次操作) 作用: 为各种数据结构提供了统一的,简便的访问接口. 使得数据结构的成员能够按照某种顺序排列. ES6中增加了遍历命令 for...of循环,Iterator接口主要供for...of消费 原理 创建一个指针对象,指向当前数据结构的起始位置. 遍历器对象本质上是一个指针. 第一…

展开运算符(spread operator) ES6中"..."的作用之一是,展开运算符. 顾名思义,它的作用是把某些结合数据展开. 在Array.Object.Set和Map上都可以使用. //array let a = [1,2,3]; let b= [0,...a,4]; // b=[0,1,2,3,4] //object let obj = {a:1,b:2}; let obj1 = {...obj,c:3}; // {a:1, b:2 , c:3} //set let set…

概要 字典是用来存储不重复key的Hash结构.不同于集合(Set)的一点,字典使用的是[key,value]的形式来存储数据. JavaScript的对象(Object:{})只能用字符串当做key.使用起来有一定限制. 为了解决这个问题,ES6提供的Map数据结构.它类似与对象,也是[key,value]的集合,但是key的范围不限于字符串,各种类型的值(包括对象)都可以当做key. 也就是说Object结构提供了 "字符串--值"的对应: Map提供了"值--值&quo…

概要 介绍: 集合是由一组无序且唯一的项组成的,这个数据结构使用了与有限集合相同的数学概念,应用在计算机的数据结构中. ES6提供了数据结构Set.它类似于数组,但是没有重复的值. 特点: key与value相同,没有重复的value. 创建 const s = new Set([1,2,3]); 方法 添加 //添加一个数据,返回set结构本身. Set.add(value); //例 s.add('1').add('2').add('c'); console.log(s); 删除 delet…