目录
前言
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());
转载：https://blog.csdn.net/yzq0820/article/details/125661584
查看评论