牛客刷题——前端面试【二】谈一谈JavaScript面向对象

前端面试秘法

提高个人编程能力就是不停的敲代码

这里我推荐一款前端面试神器----->点击跳转学习​​​​​​​

系列内容请关注：前端面试

目录

 前言

一、类的定义（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());

结束语：

这里推荐大家可以有效提高个人能力的平台

前端面试神器----->点击跳转

让我们一起进步，拿到自己想要的offer