ES6基础----Class的使用

目录

1、ES5 中定义类  ---function

2、es5 中定义类的方法,需要在原型(prototype)上定义

3、ES6 出现 Class 用于定义类, Class 定义的类和 function 定义的类功能都大致相同,出现 Class 的原因是想让定义的类更符合面向对象的编程逻辑思维,让开发者更好接受

4、继承extends    子类继承父类的属性及方法

5、静态的属性 static 有的属性及方法不想被实例所引用,只能被类直接引用


1、ES5 中定义类  ---function

 function Person(name,age) {  

          this.name = name;

         this.age = age;

        }

2、es5 中定义类的方法,需要在原型(prototype)上定义

 //      类      原型     定义的方法

        Person.prototype.xingwei= function(){

             console.log(this.name+"会思考");  //this 谁用表示谁,new 的对象
        }
  //第一种直接传参      

        const xiaohua=new Person("小华",20);
//第二种,单独传参,一个一个传        

  xiaohua.name="李四";

 xiaohua.age=50;



console.log(xiaohua.name);//小华

console.log(xiaohua.age);//20

xiaohua.xingwei();//会思考

3、ES6 出现 Class 用于定义类, Class 定义的类和 function 定义的类功能都大致相同,出现 Class 的原因是想让定义的类更符合面向对象的编程逻辑思维,让开发者更好接受

 class Dog{//--定义 Dog 类,里面包含属性和方法

//constructor 用于在 Class 中定义属性

        constructor(name,age){//--定义属性,必须用 constructor

            this.name = name;

            this.age = age;

        }
//定义方法,直接定义,不需要写在原型上

        run() {//定义方法

            console.log(this.name+"会跑");

        };

    }
  const wangcai=new Dog("旺财",5);

    console.log(wangcai.name);//旺财

    console.log(wangcai.age);//5

    wangcai.run();//旺财会跑


 

4、继承extends    子类继承父类的属性及方法

    class dog1 extends Dog{

5、静态的属性 static 有的属性及方法不想被实例所引用,只能被类直接引用

        static test="这是静态的属性";

 constructor(name,age,sex){

//使用 super 在子类中指定父类的属性

            super(name,age);

            this.sex=sex;

        }
//方法重写 :  子类中方法名和父类方法名一样,子类的方法会覆盖父类

        run(){

            console.log(this.name+"会看家,会跑路")

        }

    }
    const wangcaiDog1=new dog1("旺财2",20);

    console.log(wangcaiDog1.name);//旺财2

    console.log(wangcaiDog1.age);//20

    console.log(wangcaiDog1.sex);//undifind ---没赋值

    console.log(wangcaiDog1.run);//旺财2会看家,会跑路

    console.log(dog1.test);// 这是静态的属性  ---再类里面可以调到值

    console.log(wangcaiDog1.test);//undifind  ----出了类


       

你可能感兴趣的:(开发语言,es6,前端)