取值函数和存值函数;
和ES5一样;同样通过set和get关键字;对某个属性进行存和取得拦截
class MyClass{ constructon(){} get prop(){ return 'getter' } set prop(value){ return console.log('setter:'+value); } }
;
var inst=new MyClass();
inst.prop='123';
//setter:123
inst.prop
//getter;
上面代码中prop对应有相应的取值函数和存值函数;因此取存都被进行自定义了;
存值和取值都是定义在Descriptor[描述]属性上的;例如如下代码
class CustomHtmlElement{
constructor(element){
this.element=element;
}
get html(){
return this.element.innerHTML;
}
set html(element){
this.element.innerHTML=value;
}
};
与函数一样;类可以使用表达式的形式定义;
const MyClass=class Me{
getClassName(){
return Me.name;
}
};
这个类的名字是MyClass;不是Me;Me只是在类的内部使用;代替当前这个类;
let inst=new MyClass();
inst.getClassName();//Me;
Me.name//出错;Me is not defined;
上面的代码说明;Me只是在函数的内部使用;如果内部没用的话;也可以直接省掉;
const MyClass=class{}
let person=new class{
constructon(name){
this.name=name;
}
sayName(){
console.log(this.name);
}
}('张三');
person.sayName();
上面代码中,person是一个立即执行的类的实例。
**注意事项:
-
类和模块默认为严格模式;所以不需要使用use strict;
-
不存在声明提升;
new Foo();//Error;
class Foo();
上面个的代码中;Foo类使用在前;定义在后;这样报错;ES6不会把类的声明提升到头部。
{
let Foo=class{};
class Barextends Foo{
}
};
这样代码不会出错;如果存在变量提升就会出错;因为class被提升到代码头部;而let不会;所以导致Bar继承Foo的时候,Foo还没有定义; -
name属性
由于本质上;ES6的类只是ES5的构造函数的一层包装;所以函数的许多特性都被class继承,包括name属性
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;
上面代码中Foo类的Symbol.iterator方法前面有个iterator前面有一个星号;表示该方法是一个Generator函数;Symbol.iterator方法返回一个Foo类的默认遍历器;for...of循环会自动调节用这个遍历器; -
this的指向;
类的方法内部如果含有this;它默认只想这个类的实例;但是必须要非常小心;一旦单独使用该方法,很可能报错
class Logger{
printName(name='there'){
tthis.print(hello ${name}
)
}
print(text){
console.log(text)
}
};
const logger = new Logger()
const {printName}=logger;
printName();//Type
2静态方法;
类相当于实例的原型;所有在类中定义的方法;都会被实例继承;如果在一个方法前面加上static;就表示该方法;不会被实例继承;而是只能通过类调用;这就称为静态方法;
class Foo{
static classMethod(){
return 'hello'
}
};
Foo.classMethod();//hello;
var foo=new Foo();
foo.classMethod();
//TypeError:foo.classMethod is ot a function;
上面代码中,Foo类的classMethod方法前面有static关键字;表明该方法;是一个静态方法;可以直接调用;不能继承使用;
父类的静态方法;可以别子类继承。
class Foo{
static classMethod(){
return 'hello'
}
}
class Bar extends Foo{
}
Bar.classMethod();//hello;
上面代码中父类Foo有个静态方法;
this指代的是类而不是实例;
class Foo {
static bar() {
this.baz();
}
static baz() {
console.log('hello');
}
baz() {
console.log('world');
}
}
Foo.bar() // hello
上面代码中,静态方法bar调用了this.baz,这里的this指的是Foo类,而不是Foo的实例,等同于调用Foo.baz。另外,从这个例子还可以看出,静态方法可以与非静态方法重名。
class Foo{
static classMethods(){
retutn 'hello'
}
}
class Bar extends Foo{
static class Method(){
return super.classMothod()+",too";
}
}
Bar.classMethod();//hello ,too;
3.实例属性的新写法;
实例属性除了
网友评论