JavaScript---类及类的继承

文章目录

目录

系列文章目录

文章目录

前言

一、类的创建及属性和方法设置

二、类的继承

1.子类继承父类---extends

2.继承时子类含有constructor---super

总结

---

---

前言

所谓类: 就是es6中对构造函数进行封装后的一种写法, 其本质其实也就是一个构造函数, 而其作用就是用来创建对象, 类通常是通过class来创建的;

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、类的创建及属性和方法设置

 创建类--class

//学生类
class Student{}
//创建学生对象
let huahua = new Student()
console.log(huahua)

 从上图我们可以看出, 类已经被创建; 并且类中也是有prototype的, 也是有构造函数constructor的; 

 设置属性和方法---constructor

 class Student{
            // 设置属性
            // constructor(形参1, 形参2){
            //     this.属性= 形参1
            //     this.属性= 形参2
            // }
            constructor (uname, uage){
                this.uname =uname
                this.uage  =uage
            }
            // 设置方法
            // 方法名(){}
            // 方法名(){}
            eat(){
                console.log('烤羊腿yyds')
            }
        }

        //创建学生对象
        let huahua = new Student('华晨宇', 31)
        console.log(huahua)

 

 基本的一个类就创建好了

属性和方法之间相互调用的规则

调用eat方法, 会出现"烤羊腿yyds!" 如果我们要表示'华晨宇爱吃烤羊腿yyds!', 应该如何实现呢?

这就要用到属性和方法之间的相互调用.我们可以在eat方法下面写上:

eat(){
  console.log(this.uname + '爱吃'+'烤羊腿yyds')
     }

这样就实现了! 但是要注意:  1. 类中的方法调用属性时, 属性前面必须要加this; 2. 类中方法与方法之间相互调用, 方法前必须加this.

二、类的继承

1.子类继承父类---extends

代码如下（示例）：

 class Marsper extends Student{}
 let marsper =new Marsper('火星人', 2)
 console.log(marsper)

 会看到子类Marsper已经继承成功, 并且是可以赋值的;

2.继承时子类含有constructor---super

如果子类是从父类继承过来的,并且此时子类中已经有constructor关键字创建的属性, 这时候,如果还想要继承父类的属性和方法, 就会出现这样的情况: 

 class Marsper extends Student{
     constructor(job) {
     this.job =job
        }
   }
 let marsper =new Marsper('火星人', 2, '歌手')
 console.log(marsper)

 报错, 并且错误中明确要求我们要在this前面调用super关键字来修改.

用上super关键字后

代码如下（示例）：

class Marsper extends Student{
constructor(uname,uage,job) {
   super(uname,uage)
   this.job =job
    }
 }
let marsper =new Marsper('火星人', 2, '歌手')
console.log(marsper)

---

 看,这样就不报错了!

总结

 1. 子类在继承父类的时候, 如果子类中没有constructor, 则子类创建的对象完全可以继承父类中的属性和方法;

2. 如果子类中已经有constructor, 则继承时必须要在this前面添加super函数;

3. super()函数作用: 用来调用父类中的constructor, 类似于构造函数实现属性继承时的call函数.