其实es6的面向对象很多原理和机制还是ES5的,只不过把语法改成类似php和java老牌后端语言中的面向对象语法. 一.用es6封装一个基本的类 class Person{ constructor( uName ){ this.userName = uName; } sayName(){ return this.userName; } } 是不是很向php和java中的类, 其实本质还是原型链,我们往下看就知道了 首先说下语法规则: class Person中的Person就是类名,可以自定义…

接着上文[js高手之路] es6系列教程 - 迭代器与生成器详解继续. 在es6中引入了一个新的循环结构for ....of, 主要是用来循环可迭代的对象,那么什么是可迭代的对象呢? 可迭代的对象一般都有Symbol.iterator属性,你可以在控制台中用console.dir打印数组,Map,Set,在他们的原型对象(prototype)上面就能找到.这个属性与迭代器密切相关,通过该函数可以返回一个迭代器,下文,我会举一个例子.一般来说所有的集合对象(数组,Set,Map 以及字符串)都是可…

第一:字面量对象的方法,支持缩写形式 //es6之前,这么写 var User = { name : 'ghostwu', showName : function(){ return this.name; } }; console.log( User.showName() ); //有了es6之后,这么写 let User = { name : 'ghostwu', showName (){ return this.name; } }; console.log( User.showName()…

什么是迭代器? 迭代器是一种特殊对象,这种对象具有以下特点: 1,所有对象都有一个next方法 2,每次调用next方法,都会返回一个对象,该对象包含两个属性,一个是value, 表示下一个将要返回的值.另一个是done,他是一个布尔值,用来表示该迭代器是否还有数据可以返回. 3,迭代器还会保存一个内部指针指向当前集合中的值 设计模式中有个迭代模式,跟迭代器是差不多的,我之前有写过2篇文章关于迭代模式: [js高手之路] 设计模式系列课程 - 迭代器(1) [js高手之路] 设计模式系列课程 -…

关于promise我在之前的文章已经应用过好几次,如[js高手之路]Node.js+jade+express+mongodb+mongoose+promise实现todolist,本文就来讲解下promise的常见用法. 为什么会有promise,他的作用是什么? promise主要是为了解决js中多个异步回调难以维护和控制的问题. 什么是promise? 从图中,我们可以看出,Promise是一个函数,这个函数上有在项目中常用的静态方法:all, race, reject,resolve等,原…

function show( flag ){ console.log( a ); if( flag ){ var a = 'ghostwu'; return a; } else { console.log( a ); return null; } } 我们从es5的变量提升开始说起, 由于变量提升的原因, 上述程序, 在第2行和第7行都能访问到a的值, 只不过是undefined, 如果你不熟悉javascript这种变量的预解释机制,可能会认为第2行和第7行会报错, 只有flag为true的时…

es5的构造函数前面如果不用new调用,this指向window,对象的属性就得不到值了,所以以前我们都要在构造函数中通过判断this是否使用了new关键字来确保普通的函数调用方式都能让对象复制到属性 function Person( uName ){ if ( this instanceof Person ) { this.userName = uName; }else { return new Person( uName ); } } Person.prototype.showUserNam…

箭头函数是es6新增的非常有意思的特性,初次写起来,可能会觉得别扭,习惯之后,会发现很精简. 什么是箭头函数? 箭头函数是一种使用箭头( => )定义函数的新语法, 主要有以下特性: 不能通过new关键字调用 没有原型, 因为不能通过new调用,所以没有原型 没有this, super,arguments和new.target绑定, new.target和super关键字是es6新增的 箭头函数中的this,取决于他的上层非箭头函数的this指向 没有arguments对象,但是可以获取到外层函…

在ES6之前,我们一般用短路表达式处理默认参数 function show( a, b ){ var a = a || 10; var b = b || 20; console.log( a, b ); } show( 100, 200 ); //100, 200 show(); //10, 20 show( 0, 0 ); // 10, 20, 0会被当做false 短路表达式(就是上例中的 || )的运算规则是: var res = a || 20;   如果a是true 就返回a, 如果a…

解构通俗点说,就是通过一种特定格式,快捷的读取对象/数组中的数据的方法, es6之前,我们通过对象名称[键] 读取数据 var User = { 'name' : 'ghostwu', 'age' : 22 }; console.log( User.name, User.age ); //ghostwu, 22 var User = { 'name' : 'ghostwu', 'age' : 22 }; let { name, age } = User; console.log( name, a…