浅谈javascript面向对象和类

本文介绍了面向对象编程的基本概念,包括封装、继承和多态等核心特性,并通过具体示例展示了如何在JavaScript中实现这些特性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

面向对象:

面向对象是为了帮助我们更好的进行编程,面向过程是分析解决问题的所需步骤然后用函数把这些步骤一步一步的实现,但是当问题的过程非常复杂的时候,面向过程就会非常麻烦 所以我们要将过程分解为不同的对象进行处理,目的是为了让一个对象处理一种行为这样相同或者相似的行为就可以使用一个函数来处理。

面向对象的三大特性:

封装 继承 多态

  • 封装:

    • 将数据的操作细节隐藏起来,只暴露对外的接口,外界调用不需要(也不可能)知道细节,就能通过对外提供的接口来访问该对象,同时也保证了外界无法任意更改对象内部的数据
  • 继承:

    • 子类继承父类,子类除了拥有父类的所有特性外,还有一些更具体的特性
  • 多态:

    • 由继承而产生了相关不同的类,对同一方法可以有不同的响应,比如cat,dog都继承自animal 但是分别实现了自己的eat方法。此时针对某一实例,不需要知道是cat还是dog直接调用eat方法。

面向切面:

如图理解:
在这里插入图片描述

ES7中无需在constructor中定义属性,可以直接在类里面定义。

  • 具有同种属性的对象称为类, 这是为了让我们更容易的管理程序, 因为类可以共享,就好像我们班级70人我们给他们每个人都指派好任务可能一晚上都讲不完,但是我们说今天晚上咱们班的男生做什么女生做什么又或者听懂了的做什么没听懂的做什么就能很简单的解决这个任务

  • 之所以将类分成父类 子类 超类 基类 我认为也是为了方便我们的编程而已,核心并没有区别,不论是基类还是超类 都是为了我们继承在接下来编写类似的内容方便修改

属性:属性又分成2类,静态属性和实例属性.

方法(属性):那么类有了我们就需要来告诉这个类你需要做什么,就是通过方法,方法是什么就是属性的组合,简单的说用属性来定义类的行为就叫做方法.在js中关注类的功能,弱化对象的类型.

静态方法和实例方法

用static定义的方法都是静态方法 静态方法的特点:
虽然可以在静态方法中使用this,但是我们禁止在静态方法中使用this静态方法中不允许使用this,意味着不允许调用实例化对象
一切实例化方法和属性都不允许调用只能调用静态属性 static d=10; 属性相当于局部变量
本质上是类属性类方法

实例方法:
用new的方法创建,实例方法要通过先定义一个引用变量,指向构造函数定义的新对象。

这里有个constructor可能比较难理解吧?

js中基本上每一个函数都拥有一个prototype属性,这个属性的值是一个对象,这个对象包含唯一一个不可枚举的属性constructor,constructor属性的值是一个函数对象;

var o=new F();

o.constructor===F //true o的constructor就是F 我们就可以使用constructor来传递接收F中的参数

上面不重要,我们只要知道constructor可以帮助我们传参

class Arrays{//这个只是帮助理解
length=0;
data={};
a=0;
b=0;
static d=10;
constructor(_a=0,_b=0){ //constructor这个就是类名
this.a=_a;
his.b=_b;
}

最重要的是当我们写一个js文件,一个html文件,想让html里面实例化的也就是new的新对象的参数可以带入到我们js文件的类中,就用constructor

//js中的类
export default class Rain{
    y=1;
    speedY=4;
    elem;
    rect;
    static WIDTH=2;
    static HEIGHT=4;
    static list=[];
    constructor(_x){
        this.elem=this.createElem(_x);
        this.moveTo(this.y);
        Rain.list.push(this);
    }

//html中
let rain=new Rain(Math.random()*1400); 
这个参数就会带入到constructor的_x里面 在接收之后一般需要this.x=_x来进行获取

简单说下继承 : 继承字面意思继承父类方法

 class List extends Arrays{  
            // Arrays就是constructor
            constructor(_a,_b,_c){//传参  constructor就是类名
                super(_a,_b);//super超类的构造函数,
                // 如果子类中需要重新描述构造函数,则必须super()执行父类的构造函数
                这句话的解释就是如果我们要增加这个构造函数的功能,我们先super执行原来的
                再添加新的
                // 并且根据需求填入对应的参数
                this.c=_c;
            }
     在下面你还可以接着给list写方法和属性
     add push 等等
     
     //另外继承会被覆盖 也就是后写的会覆盖继承的

存储器

class  Animal {
	constructor() {
		this.name = name
	}
	get name() {
		return this.name
	}
	
	set name(val) {
		this.name = val
	}
}

let ani = new Animal("Dog")   //直接赋值
console.log(ani.name) // 调用getter
ani.name = "cat" // 调用setter
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

MaxLoongLvs

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值