当前位置: 首页 > 工具软件 > Classing{js} > 使用案例 >

js中的class类

贡可人
2023-12-01

这是es6的新特性,用于实现面向对象的编程

1.class类的创建

  1. 创建一个class类
class myClass{
	//构造器,默认为空的构造器
	//当class在被new时就会调用构造器
	//相当于function
	//function myClass(name,age){
	//	this.name=name
	//	this.age=age
	//}
	constructor(name,age){
		//这些都是实例属性
		//只有实例才能访问
		this.name=name
		this.age=age
	}
}
  1. 创建类实例对象
var i=new myClass('小明',18)

2.class中的静态属性

  1. 创建静态属性
class myClass{
	static info="这是myClass的静态属性"
}
  1. 静态属性的使用
    静态属性只有类才能访问,不能通过实例进行访问
console.log(myClass.info)
//i.info访问不到
  1. function中的静态属性
//直接在外部挂载给构造函数就是给function定义静态属性
function myFunction(){}
myFunction.info="这是function的静态属性"
//使用
console.log(myFunction.info)

3.class中的实例方法

  1. 定义实例方法
class myClass{
	//只有new出来的实例才能访问
	//类无法访问
	aFunction(){
		console.log('这是myClass的实例方法')
	}
}
  1. 实例方法的使用
var i=new myClass()
i.aFunction()
  1. function中的实例方法
function myFunction(){}
myFunction.prototype.aFunction=function(){
	console.log('这是function中的实例方法')
}
//使用
var a=new myFunction()
a.aFunction()

4.class中的静态方法

  1. 定义静态方法
class myClass{
	//只有类才能访问
	//实例无法访问
	static staticFunction(){
		console.log('这是myClass的静态方法')
	}
}
  1. 静态方法的使用
myClass.staticFunction()
  1. function中的静态方法
function myFunction(){}
myFunction.staticFunction=function(){
	console.log('这是function中的静态方法')
}
//使用
myFunction.staticFunction()

在class内部只能写构造函数,静态属性,静态方法,实例方法
class的静态方法和静态属性都挂载到constructor上,实例属性和方法都挂载到了实例对象上
就是把function封装成了class,class的本质还是function,使用起来更加方便了

5.class中的继承

  1. 定义父类
class father{
	constructor(name,age){
		this.nane=name
		this.age=age
	}
	holle(){
		console.log('holle')
	}
}
  1. 继承父类
class son extends father{
}

继承之后,如果子类中没有定义,就会沿用父类中的方法或属性
子类对父类的方法和属性可以进行重构和重载
但是,如果是继承的父类中有定义构造函数
就必须加一个super()
然后接着添加子类的构造方法,不能将父类中的构造函数覆盖
super()是对父类构造器的一个引用,相当于父类中的constructor()方法直接写入到了子类中

 类似资料: