JavaScript面向对象class
阅读原文时间:2023年07月08日阅读:3

JavaScript面向对象class

本周逆战班学习的主题是“面向对象”,很多人觉得面向对象很难理解,但其实我们早就在面向对象的思想之中了,今天就让我们再重新认识一下他,主要介绍一下ES6中新增的class类…


面向对象是一种高级的编程思想OO(Object Oriented)

从最开始面向二进制,面向指令,面向自然语言编程,到现如今的面向对象,顾名思义,对象“Object”就是整个思想的中心。面向对象其实就是一种符合我们人类思维习惯的编程思想。

提到面向对象,自然就会想到面向过程,面向过程就分析解决问题所需要的步骤,例如将大象装入冰箱,需要几步,需要哪几步,按照步骤用函数将这些一一实现,而面向对象就是将需要解决的问题分解成多个独立的对象,通过调用对象的方法来解决问题。这样子当程序发生改变,我们只要找到相对应的对象进行修改,就方便的多。


1、面向对象的特点:封装性(忽略细节,选择执行,重复使用)、继承性(方便的扩展,子拿父)和多态性(多种形态,可以实现动态的扩展);

2、面向对象的优势:信息的查找速度快,信息的传播速度快

★3、js面向对象class

随着ES6中关键词class的出现,使得定义类变得更加的简单。

语法格式:

//class CreatePerson{

//     constructor ( ){ }

//     自定义方法名( ){ }

// }

// new CreatePerson( );

首先用函数实现CreatePerson的方法:

function CreatePerson(n,a){

this.name = n;

this.age = a;

}

CreatePerson.prototype.show = function(){

console.log(this.name + "---" + this.age);

}

如果用class关键字来写CreatePerson,

class CreatePerson{

constructor(n,a){

this.name = n;

this.age = a;

}

show(){

console.log(this.name + "---" + this.age);

}

}

var p1 = new CreatePerson("admin",18);

p1.show();

尽管看上去代码变长了,但是仔细观察,我们会发现结构变得更加的清晰,我们可以发现CreatePerson等价于构造函数的名字,constructor(){}等价于构造函数的函数体,自定义方法名(){}等价于绑定在构造函数原型上的方法。

我们可以看一个选项卡的例子来加深一下印象:

  • 1
  • 2
  • 3

class的出现,使我们的程序变得更加简单,好好使用反复练习,在书写之前一定要进行分析,注意细节,逻辑严谨。