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

前端面试秘法

提高个人编程能力就是不停的敲代码
这里我推荐一款前端面试神器----->点击跳转学习??????? 系列内容请关注:前端面试
#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片

目录
前言
一、类的定义(class)
语法:
二、给类添加方法
三、类的继承(extends、调用super())
1.继承父类普通属性
2.调用父类的构造函数
3.调用父类的普通函数
四、私有属性的获取
语法:

前言 JavaScript 语言中,生成实例对象的传统方法是通过构造函数,ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。
一、类的定义(class) 使用class关键词 声明类,constructor为构造方法,一个类必须有constructor()方法,如果没有显式定义,一个空的constructor()方法会被默认添加,this关键字则代表实例对象。
注意:不需要在使用function(){}
语法: 基本语法
class Name {}

创建实例:
varp1 = 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);

#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片


二、给类添加方法 需要将填加的东西直接放入,定义的类中
举例:
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('中国');

#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片


三、类的继承(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(); //可以获取父类的内容

#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片


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); //获取子类所添加的内容 //在实际开发中,可以通过调用来节省时间,在调用的基础上增加,所需要的内容。


#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片


3.调用父类的普通函数
父类:
class Fsther { say(){ return '我是小明'; } }

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

#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片


四、私有属性的获取 语法:
#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());

【#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象】#|牛客刷题——前端面试【二】谈一谈JavaScript面向对象
文章图片

结束语: 这里推荐大家可以有效提高个人能力的平台 前端面试神器----->点击跳转 让我们一起进步,拿到自己想要的offer

    推荐阅读