likes
comments
collection
share

js class定义及使用

作者站长头像
站长
· 阅读数 56

什么是class

程序中专门集中保存一种类型的所有子对象统一属性结构和方法定义程序结构

如何定义class

js 的原生的定义方式:
    function Student(name,age){
      this.name= name ;
      this.age = age;
    }
    Student.prototype.intr= function(){
        console.log(`我叫${this.name};我今年${this.age}岁`)
    }
    var person = new Student('张三',18)
    person.intr(); //我叫张三;我今年18岁

注:定义在全局对象上 js  class定义及使用

使用class定义:
  1. class{}包裹原构造函数+原型对象方法
  2. 原构造函数名升级为整个class的名字,所有构造函数统一更名为constructor
  3. 原型对象中的方法,不用再加prototype前缀,也不用=function,直接简写为: 方法名(){ ... ...}
    class Student {
      constructor(name, age) {
        this.name = name;
        this.age = age;
      }
      intr() { // 自动放入原型对象中
        console.log(
          `我叫${this.name}, 我${this.age}岁`);
      }
    }
    var person = new Student('张三', 18)
    person.intr(); //我叫张三;我今年18岁

注:定义在脚本

js  class定义及使用 问题:在class{}内的方法定义保存在哪里?

结果:都保存在原型对象上;其本质都是一样的,打印person 之后出现的数据结构都是一样的。 js  class定义及使用

问题:如果多个子对象共用的相同的属性值,应该放在那里?该如何访问

共有属性放置static className="高一(2)班"

共有属性访问Student.className

class{
    constructor(name, age) {
        this.name = name;
        this.age = age;
      }
    static className="高一(2)班"  // static 共有属性名=属性值
    intr() { // 自动放入原型对象中
        console.log(
          `我叫${this.name}, 我${this.age}岁`,${Student.className});
      }
    }
}

class 中 extends 和 super 的使用:

    class people{
        constructor(name,sex,age){
          this.name= name;
          this.sex= sex;
          this.age= age;
        }
         peopleAction(){
          console.log(`我叫${this.name},我是${this.sex},我今年${this.age}岁`)
        }
      }
      class men extends people{
         constructor(name,sex,age,noBirthBaby){
            super(name,sex,age)
            this.noBirthBaby = noBirthBaby;
         }
         action(){
          console.log(`我叫${this.name},我是${this.sex},我今年${this.age}岁,我${this.noBirthBaby}生娃`)
         }
      }
      var tom = new men('Tom','男','5','不会')
      tom.peopleAction() //我叫Tom,我是男,我今年5岁 --使用父类的方法
      tom.action()  //我叫Tom,我是男,我今年5岁,我不会生娃
      
      var Mill = new men('Mill','女','21','会')
      Mill.action() //我叫Mill,我是女,我今年21岁,我会生娃
转载自:https://juejin.cn/post/7070128588007145509
评论
请登录