js ES6类class整理

在es5中,生成实例对象的方法是通过构造函数
在es6中,通过class关键字,可以定义类,
类必须要用new调用否则会报错

//es5
function Person(name,age){
      this.name=name;
      this.age=age;
      }
 var obj =new Person("张三",18);
 console.log(obj.name,obj.age);//张三 18
 console.log(typeof Person);//function
 //es6
 class Person{
 	constructor(name,age){
 	    this.name=name;
 	    this.age=age;
 	    }
 	 }
 let obj=new Person("张三",18);
  console.log(obj.name,obj.age);//张三 18
   console.log(typeof Person);//function

**constructor是类的默认方法,通过new命令生成对象实例时,自动调用这个方法
一个类必须有constructor方法,如果没有显示定义,一个空的constructor方法会默认添加
constructor默认返回实例对象(this),还可以指定返回另外一个对象
**

class Aoo{
 constructor(){
  return Object.create(null);//初始化了一个新的对象
   }
 }
 console.log(new Aoo() instanceof Aoo);//false 检测出来的实例对象不是Aoo类的实例

在类中定义方法

//es5
Person.prototype.getInfo=function(){
}
//es6               
class Person{                 
 getInfo(){},                 
 toString(){}
 }
 //等同于
 Person.prototype={
 getInfo(){},                 
 toString(){}
 }
 //还可以通过Object.assign()方法
 Object.assign(Person.prototype,{
  getInfo(){},                 
  toString(){}
 });

类的静态方法static关键字
所有在类中定义的方法,都会被实例继承,
如果在一个方法前,加上static关键字,就表示这方法不会被实例继承,而是直接通过类调用

class Aoo{
 static getAoo(){
 return "hello";
   }
}
console.log(Aoo.getAoo());//在类上调用这个方法,可以执行  hello
var aoo=new Aoo();//实例对象
console.log(aoo.getAoo());//报错 
//静态属性
//老写法
class Aoo{
}
Aoo.name="张三";
//新写法
class Aoo{
 static name="张三";
 }

**class继承
extends关键字实现继承
子类必须在construct方法中调用super方法,否则新建实例时会报错,在子类的构造函数中,只有调用了super之后,才可以使用this关键字,否则会报错
父类的静态方法,会被子类继承
**

class Person{
 construct(name,age){
    this.name=name;
    this.age=age;
    static getInfo(){//父类的静态方法,会被子类继承
    console.log("hello");
    }
  }
class Student extends Person{
	construct(number){
	super();//如果不加入super方法,新建实例会报错
	this.number=number;//只有调用了super方法后,才可以使用this关键字
	}
}
var person1=new Person("张三",18);
console.log(person1.name,person1.age);//张三 18
Person.getInfo();//hello      父类的静态方法,会被子类继承
Student.getInfo();//hello
var student1=new Student("101");
student1.name="Marry";
student1.age=20;
console.log(student1.name,student1.age,student1.number);//Marry 20 101
发布了22 篇原创文章 · 获赞 26 · 访问量 623

猜你喜欢

转载自blog.csdn.net/HwH66998/article/details/104564828
今日推荐