JavaScript 面向对象的基本用法

发布时间:2024-10-21 14:01

目录

前言

一、类的定义(class)

语法:

创建实例:

举例:

二、给类添加方法

举例:

三、类的继承(extends、调用super())

举例:

1.继承父类普通属性

2.调用父类的构造函数

3.调用父类的普通函数

四、私有属性的获取

语法:

举例:


前言

       JavaScript 语言中,生成实例对象的传统方法是通过构造函数,ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。

一、类的定义(class)

    使用class关键词 声明类,constructor为构造方法,一个类必须有constructor()方法,如果没有显式定义,一个空的constructor()方法会被默认添加,this关键字则代表实例对象。

     注意:不需要在使用function(){}

语法:

基本语法

class Name {

}

创建实例:

var  p1 = new name();//p1是自己取的

举例:

   class UserName{
            constructor(uname,age){
                this.uname=uname;
                this.age = age; 
            }
    }
        var xm=new UserName('小明',18);
        console.log(xm.uname ,xm.age);

二、给类添加方法

  需要将填加的东西直接放入,定义的类中

举例:

        class UserName{
            constructor(uname,age){
                this.uname=uname;
                this.age = age; 
            }
            sing(song){
                console.log('唱歌');//直接调用
                console.log(this.uname+song);//使用函数传递参数
            }
        }
        var xm=new UserName('小明',18);
        console.log(xm.uname ,xm.age);
        xm.sing('中国');
 

三、类的继承(extends、调用super()

Class 可以通过extends关键字实现继承,让子类继承父类的属性和方法。

ES6 规定,子类必须在constructor()方法中调用super(),否则就会报错。

举例:

1.继承父类普通属性

父类:

    class Fsther {
        constructor(){
        }
        money(){
            console.log(100);
        }
    }

子类:

 class Son extends Fsther{
    }
    var son = new Son();//给子类实例化
    son.money();//可以获取父类的内容

2.调用父类的构造函数

父类:

   class Fsther {
        constructor(x,y){
            this.x=x;
            this.y=y;
        }
        addition(){
            console.log(this.x+this.y);
        }
    }

子类:

 class Son extends Fsther{
        constructor(x,y,z){
            super(x,y);//获取父类的构造函数,super必须在子类使用this前,调用父类
            this.z=z;//子类的添加
        }
    }
    var son = new Son(1,2,5);
    son.addition();
    console.log(son.z);//获取子类所添加的内容
//在实际开发中,可以通过调用来节省时间,在调用的基础上增加,所需要的内容。

3.调用父类的普通函数

父类:


    class Fsther {
      say(){
        return '我是小明';
      }
    }

子类:

    class Son extends Fsther{
       say(){
        console.log(super.say()+'的儿子');
       }
    }
    var son = new Son();
    son.say();

四、私有属性的获取

语法:

#p=1;
getp(){
	return this.#p;
}

举例:

    class Fsther {
    #money=10000             //设置私有属性
    getMoney(){              //获取私有属性
        return this.#money;
    }
    }
    class Son extends Fsther{
    }
    var son = new Son();
    var f = new Fsther();
    f.getMoney();
    console.log(f.getMoney());
    console.log(son.getMoney());

ItVuer - 免责声明 - 关于我们 - 联系我们

本网站信息来源于互联网,如有侵权请联系:561261067@qq.com

桂ICP备16001015号