目录Class类的使用[声明、属性、方法、继承]基本语法——如何声明一个类?ES5ES6类和构造函数有什么区别?Setters&Getters-如何读写属性?ES5ES6getter/setter是一个读写属性StaticMethods-如何操作一个方法?ES5ES6开发什么时候用对象实例方法什么时候用静态方法?子类-如何继承另一个类?ES5ES6ES6-ES10学习布局类的使用【声明、属性、方法、继承】基本语法——如何声明一个类?ES5letAnimal=function(type){this.type=typethis.eat=function(){console.log('我正在吃东西')}}letdog=newAnimal('dog')letmonkey=newAnimal('monkey')console.log(dog.eat())//我在吃foodconsole.log(monkey.eat())//我在吃foodmonkey.eat=function(){console.log('error')}console.log(dog.eat())//iameatfoodconsole.log(monkey.eat())//error//dog实例化后修改,monkey不会改变,从而失去概念遗产。如果是公有方法,就不要写在类的私有方法中。所以把public方法放在原型对象上('dog')letmonkey=newAnimal('monkey')console.log(dog.eat())//我正在吃foodconsole.log(monkey.eat())//我正在吃foodmonkey.constructor.prototype.eat=function(){console.log('error')}console.log(dog.eat())//errorconsole.log(monkey.eat())//errorES6classAnimal{constructor(type){this.type=type}eat(){console.log('我正在吃东西')}}letdog=newAnimal('dog')letmonkey=newAnimal('monkey')console.log(dog.eat())console.log(monkey.eat())类和构造函数有什么区别?没有区别,class只是ES5使用原型链声明构造函数的语法糖console.log(typeofAnimal)//functionSetters&Getters-如何读写属性?ES5无法实现读写属性的拦截操作,只读属性等不易实现ES6getter/setter是读写属性读取属性classAnimal{constructor(type){this.type=type}//age前面加个get/set,就变成属性了,es6支持把属性提升到函数体的顶层,没必要全部写到构造函数里//get是一个只读属性获取age(){return4}eat(){console.log('iameatfood')}}letdog=newAnimal('dog')console.log(dog.age)//4dog.age=5console.log(dog.age)//4赋值给age不生效写属性let_age=4classAnimal{constructor(type){this.type=type}//读取getage(){return_age//返回值Don'不能和属性名age一样}//写setage(val){if(val<7&&val>4){_age=val//返回值不能和属性名age一样}}eat(){console.log('iameatfood')}}letdog=newAnimal('dog')console.log(dog.age)//4dog.age=5//满足条件,修改age属性的值console.log(dog.age)//5dog.age=8//不满足条件,没有修改age属性的值console.log(dog.age)//5StaticMethods——如何操作方法?对象实例方法类的静态方法ES5letAnimal=function(type){this.type=type}//对象实例方法Animal.prototype.eat=function(){Animal.walk()//这里不用这个因为这里this指的是实例对象,walk方法在构造函数上,不在实例对象上被传递实例对象访问Animal.walk=function(){console.log('iamwalking')}letdog=newAnimal('dog')dog.eat()//我在走路//我在吃东西fooddog.walk()//dog.walkisnotafunctionerrorES6staticidentifiercanimplementclassAnimal{constructor(type){this.type=type}//对象实例方法,类中直接定义的方法就是实例对象的方法eat(){Animal.walk()console.log(this)//这里的class指的是Animal,这里不能用this.type,因为Animal上没有type属性,它的原型对象有type属性console.log('iameatfood')}//添加一个静态方法,通过静态标识符区分staticwalk(){console.log('iamwalking')}}letdog=newAnimal('dog')dog.eat()//iWhenamwalking//iameatfood开发使用对象实例方法,什么时候使用静态方法?如果这个函数内部有要使用的实例对象的属性和方法,则必须定义为该类的实例对象方法。如果函数内部不需要实例对象的内容,则使用类的静态方法。子类-如何继承另一个类?面向对象之所以强大,是因为继承。ES5先继承Animal构造函数内部的属性和方法,再继承原型链上的属性和方法letAnimal=function(type){this.type=type}Animal.prototype.eat=function(){Animal.walk()console.log('iameatfood')}Animal.walk=function(){console.log('iamwalking')}//声明一个Dog构造函数,它继承Animal构造函数,并运行Animal构造函数Letthis指向Dog的构造函数letDog=function(){//1.初始化父类的构造函数,使用call将this指向Dog实例,后面是传入的参数,有多少根据this你可以往后排//这里只能继承Animal构造函数里面的属性和方法Animal.call(this,'dog')}//2.剩下的部分挂载在原型链上继承,需要把Dog的原型链指向Animal的原型链——引用类型Dog.prototype=Animal.prototypeletdog=newDog('dog')dog.eat()//iamwalking//iameatingfoodES6extends可以实现classAnimal{constructor(type){this.type=type}eat(){Animal.walk()console.log(this.type+'eatfood')}staticwalk(){console.log('iamwalking')}}//用extends实现继承,用它来表示Dog是Animal的子类classMonkeyextendsAnimal{//默认执行下面的语句。如果构造函数没有这样写的新属性,那么你不需要写//constructor(type){//super(type)//继承父类执行父类构造函数,特殊方法//}}classDogextendsAnimal{constructor(type){//super必须在构造函数的第一行,否则会报错,以及参数super(type)this.age=2}hello(){//super对象总是指向父类,调用它就是调用父类构造函数super.eat()console.log('andsayhello')}}letdog=newDog('dog')letmonkey=newMonkey('monkey')dog.eat()monkey.eat()//我在走路//狗吃食物//我在走路//monkeyeatfooddog.hello()//我在走路//dogeatfood//然后打个招呼
