Home > Web Front-end > Front-end Q&A > What is a class in javascript

What is a class in javascript

青灯夜游
Release: 2023-01-11 09:20:37
Original
4335 people have browsed it

In JavaScript, a class is a user-defined type, also called a class type, which is a collection of groups with the same attributes and behaviors; starting from es6, you can define a class by creating the class keyword Template, for example "class class name {}".

What is a class in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

What is a class

In object-oriented programming, a class is a template of an object and defines the same group of objects. (also called "instances") have properties and methods that are common to all instances. A class is a user-defined reference data type, also called a class type.

We can understand that a class is a collection of groups with the same attributes and behaviors.

Classes in JS

Before ES5, to express a class in JS, a method called The syntax style of prototype-based

	function 士兵(id,hp){
	    this.id = id
	    this.hp = hp
	}
	士兵.prototype = {
	    constructor:士兵()
	    walk:function(){ } ,
	    Shooting:function(){ } ,
	}
Copy after login

In es6, the concept of class was introduced for the first time, and the template of a class was defined by creating the class keyword.

1. Create a Class in js

class Number{
}
Copy after login

2. Implement the constructor, instance properties and instance methods of Class

//构造方法
class Number{
//实例属性
constructor(id,age){
//this指向当前事件
this.id=id;
this.age=age;
}
//实例方法
num(){
console.log("hh");
}
}
//实例化对象
var n1=new Number("1","2");
n1.num(1);
console.log(n1.id);
console.log(n1.age);
var n2=new Number("3","4");
n2.num(2);
console.log(n2.id);
console.log(n2.age);
Copy after login

Effect display:

hh
1
2
hh
3
4
Copy after login

3. Static properties and static methods of Class

//构造方法
class Number{
//静态属性调用一个方法
static ppp=1;
//实例属性
constructor(id,age){
//this指向当前事件
this.id=id;
this.age=age;
console.log(Number.ppp)
}
//实例方法
num(){
console.log("hh");
}}
//实例化对象
var n1=new Number("1","2");
n1.num(1);
console.log(n1.id);
console.log(n1.age);
var n2=new Number("3","4");
n2.num(2);
console.log(n2.id);
console.log(n2.age);
Copy after login

Effect display:

1
hh
1
2
1
hh
3
4
Copy after login

4.Class inheritance

//父类
class Father{
//构造方法不能被继承
constructor(){
console.log("我是父亲");
this.name="father"
}
}
//子类
class Son extend Father{
//执行子类构造方法之前必须先执行父类构造方法
constructor(){
super();//执行父类构造方法
console.log("我是儿子")
}
}
var son=new Son;
console.log(son.name)
Copy after login

Effect display:

我是父亲
我是儿子
father
Copy after login

[Recommended learning: javascript advanced tutorial]

The above is the detailed content of What is a class in javascript. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template