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

前端面试秘法

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

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

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

牛客刷题——前端面试【二】谈一谈JavaScript面向对象_第1张图片

目录

 前言

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

你可能感兴趣的:(#,前端面试,前端,面试,职场和发展,javascript,学习)