我们说类的时候,先回忆一下es5的构造函数
function myobj(x,y){ this.x= x; this.y =y; } myobj.prototype.add = function(){ return this.x+this.y } var num = new myobj(10,5); console.log(num.add()); //15
这是构造函数的写法,到了es6出现clss类的写法。下面代码等价于上面的代码
class muobj{ constructor(x,y){ this.x = x; this.y = y; } add(){ return this.x+this.y } } var numb = new myobj(10,5); console.log(numb.add()); //15
在上面的代码中我们可以看到出现了关键字class,它可以和对象模板定义一个类。
可以在上面我们看到了一个 constructor 它是es6的构造方法,而this指向实例的对象。
constructor
方法是类的默认方法,通过new
命令生成对象实例时,自动调用该方法。一个类必须有constructor
方法,如果没有显式定义,一个空的constructor
方法会被默认添加。
也就是说es6的构造方法对应es5构造函数
class定义的类,里的方法都是直接定义在原型上的。
class b{ s(){} d(){} } // 等价于 function b(){} b.prototype = { s(){}, d(){} }
而且class定义的类都是是不能枚举的。
属性表达式的写法
let myname = "getdata"; class stk { constructor(x){ this.x =x; } [myname](){ return this.x } } var stkn = new stk("好"); console.log(stkn.getdata()); //好
上面我们定义一个变量,并且赋值“getdata”,在书写类的时候使用 [myname] 表达式。
我们使用的时候,使用的是getdata,并不是myname了。
class表达式的写法
//class 表达式 const myc = class me{ constructor(x){ this.x =x } } let hu = new myc('李四'); console.log(hu.x); //李四
采用 Class 表达式,可以写出立即执行的 Class。
name属性
name属性用于获得class类名
class Point {} Point.name // "Point"
Generator 方法
如果某个方法之前加上星号(*
),就表示该方法是一个 Generator 函数。
class Foo { constructor(...args) { this.args = args; } * [Symbol.iterator]() { for (let arg of this.args) { yield arg; } } } for (let x of new Foo('hello', 'world')) { console.log(x); }
// hello
// world
this指向问题
在使用的过程中可能会存出现 TypeError: Cannot read property 'XXXX' of undefined
很可能是this的指向问题。
建议的写法就是使用箭头函数
先暂停一下。我去回头补上