【温故而知新】JavaScript类、类继承、静态方法

2024-01-22 19:12

本文主要是介绍【温故而知新】JavaScript类、类继承、静态方法,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

文章目录

  • 前言
  • 一、类
  • 二、类继承
  • 三、静态方法
  • 四、热门文章

前言

JavaScript是一种广泛使用的编程语言,主要用于Web开发。它是一种脚本语言,这意味着它不需要像编译语言那样预先编译,而是在运行时解释和执行。JavaScript可以直接在浏览器中运行,这使得它在前端开发中特别重要,可以用于动态生成和更改网页内容、响应用户交互、发送和接收数据等。

JavaScript的主要特点包括:

  1. 动态类型:变量可以在运行时更改其数据类型。
  2. 面向对象:JavaScript是一种面向对象的编程语言,支持类和继承。
  3. 异步编程:JavaScript支持异步编程,这使得它可以处理如用户交互和网络请求等异步事件。
  4. 浏览器兼容性:大多数现代浏览器都支持JavaScript。

一、类

JavaScript中的类(Class)是一种用于创建对象的蓝图。类定义了对象的属性和行为,可以实例化多个对象,并且对象之间可以共享类定义的属性和方法。下面是一个简单的JavaScript类的概念和案例代码:

类定义语法:

class ClassName {constructor(parameter1, parameter2, ...) {// 构造函数,用于初始化对象的属性this.property1 = parameter1;this.property2 = parameter2;// ...}method1() {// 方法1// 可以使用this关键字来访问对象的属性}method2() {// 方法2}//...
}

案例代码:

class Person {constructor(name, age) {this.name = name;this.age = age;}sayHello() {console.log("Hello, my name is " + this.name);}getAge() {return this.age;}setAge(newAge) {this.age = newAge;}
}// 创建一个Person对象
let person1 = new Person("John", 25);// 调用对象的方法
person1.sayHello(); // 输出 "Hello, my name is John"// 访问对象的属性
console.log(person1.name); // 输出 "John"// 调用对象的方法
console.log(person1.getAge()); // 输出 25// 修改对象的属性
person1.setAge(30);
console.log(person1.getAge()); // 输出 30

注意:JavaScript中的类是引用类型。因此,如果将一个对象赋值给另一个变量,实际上只是将对象的引用赋值给了新的变量,而不是创建了一个新的对象。修改其中一个对象的属性,会影响到其他引用该对象的变量。

二、类继承

JavaScript中的类继承是一种允许一个类继承另一个类的属性和方法的机制。子类继承了父类的所有属性和方法,并且可以在子类中添加新的属性和方法或对父类的方法进行重写。下面是一个简单的JavaScript类继承的概念和案例代码:

类继承语法:

class ChildClass extends ParentClass {constructor(parameter1, parameter2, ...) {super(parameter1, parameter2, ...);// 子类必须在constructor中调用super()方法来调用父类的构造函数// 这样子类才能继承父类的属性和方法// 可以在constructor中初始化子类独有的属性}// 子类可以添加自己的方法childMethod() {// ...}// 子类可以重写父类的方法parentMethod() {super.parentMethod(); // 使用super调用父类的方法// ...}// ...
}

案例代码:

class Animal {constructor(name) {this.name = name;}eat() {console.log(this.name + " is eating.");}
}class Dog extends Animal {constructor(name, breed) {super(name);this.breed = breed;}bark() {console.log(this.name + " is barking.");}
}// 创建一个Dog对象
let dog1 = new Dog("Max", "Labrador");// 调用父类的方法
dog1.eat(); // 输出 "Max is eating."// 调用子类自己的方法
dog1.bark(); // 输出 "Max is barking."// 子类继承了父类的属性
console.log(dog1.name); // 输出 "Max"// 子类可以添加自己的属性
console.log(dog1.breed); // 输出 "Labrador"

在上面的例子中,Dog类继承了Animal类的属性和方法。Dog类通过调用super(name)来调用父类的构造函数,以便继承父类的name属性。Dog类还添加了自己的属性breed和方法bark。通过创建Dog对象,我们可以调用父类的eat方法和子类的bark方法,并访问到继承的属性name和新增的属性breed。

三、静态方法

JavaScript静态方法是定义在类本身上而不是实例上的方法。静态方法可以直接通过类调用,而不需要创建类的实例。静态方法通常用于执行与类相关的操作或实现工具函数,而不是对类的实例进行操作。下面是一个简单的JavaScript静态方法的概念和案例代码:

静态方法语法:

class ClassName {static staticMethod(parameter1, parameter2, ...) {// 执行静态方法的代码}
}// 调用静态方法
ClassName.staticMethod(parameter1, parameter2, ...);

案例代码:

class MathUtils {static add(a, b) {return a + b;}static subtract(a, b) {return a - b;}
}// 调用静态方法
let result1 = MathUtils.add(5, 3); // 8
let result2 = MathUtils.subtract(5, 3); // 2
console.log(result1);
console.log(result2);

在上面的例子中,MathUtils类定义了两个静态方法add和subtract。可以直接通过类名调用这些静态方法,而不需要创建MathUtils类的实例。调用静态方法时,参数被传递给方法,并且该方法返回一个结果。在这个例子中,我们通过调用MathUtils类的add和subtract方法,将两个数相加和相减,并将结果打印到控制台上。

需要注意的是,静态方法不能访问实例的属性或方法,因为它们不是类的实例方法,而是与类本身相关的方法。静态方法通常用于执行一些与类相关的操作,而不是操作实例。

四、热门文章

【温故而知新】JavaScript数字精度丢失问题
【温故而知新】JavaScript的继承方式有那些
【温故而知新】JavaScript中内存泄露有那几种
【温故而知新】JavaScript函数式编程
【温故而知新】JavaScript的防抖与节流
【温故而知新】JavaScript事件循环

这篇关于【温故而知新】JavaScript类、类继承、静态方法的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/633966

相关文章

Java学习手册之Filter和Listener使用方法

《Java学习手册之Filter和Listener使用方法》:本文主要介绍Java学习手册之Filter和Listener使用方法的相关资料,Filter是一种拦截器,可以在请求到达Servl... 目录一、Filter(过滤器)1. Filter 的工作原理2. Filter 的配置与使用二、Listen

Spring Boot中JSON数值溢出问题从报错到优雅解决办法

《SpringBoot中JSON数值溢出问题从报错到优雅解决办法》:本文主要介绍SpringBoot中JSON数值溢出问题从报错到优雅的解决办法,通过修改字段类型为Long、添加全局异常处理和... 目录一、问题背景:为什么我的接口突然报错了?二、为什么会发生这个错误?1. Java 数据类型的“容量”限制

Java对象转换的实现方式汇总

《Java对象转换的实现方式汇总》:本文主要介绍Java对象转换的多种实现方式,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录Java对象转换的多种实现方式1. 手动映射(Manual Mapping)2. Builder模式3. 工具类辅助映

SpringBoot请求参数接收控制指南分享

《SpringBoot请求参数接收控制指南分享》:本文主要介绍SpringBoot请求参数接收控制指南,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Spring Boot 请求参数接收控制指南1. 概述2. 有注解时参数接收方式对比3. 无注解时接收参数默认位置

SpringBoot基于配置实现短信服务策略的动态切换

《SpringBoot基于配置实现短信服务策略的动态切换》这篇文章主要为大家详细介绍了SpringBoot在接入多个短信服务商(如阿里云、腾讯云、华为云)后,如何根据配置或环境切换使用不同的服务商,需... 目录目标功能示例配置(application.yml)配置类绑定短信发送策略接口示例:阿里云 & 腾

SpringBoot项目中报错The field screenShot exceeds its maximum permitted size of 1048576 bytes.的问题及解决

《SpringBoot项目中报错ThefieldscreenShotexceedsitsmaximumpermittedsizeof1048576bytes.的问题及解决》这篇文章... 目录项目场景问题描述原因分析解决方案总结项目场景javascript提示:项目相关背景:项目场景:基于Spring

Spring Boot 整合 SSE的高级实践(Server-Sent Events)

《SpringBoot整合SSE的高级实践(Server-SentEvents)》SSE(Server-SentEvents)是一种基于HTTP协议的单向通信机制,允许服务器向浏览器持续发送实... 目录1、简述2、Spring Boot 中的SSE实现2.1 添加依赖2.2 实现后端接口2.3 配置超时时

Spring Boot读取配置文件的五种方式小结

《SpringBoot读取配置文件的五种方式小结》SpringBoot提供了灵活多样的方式来读取配置文件,这篇文章为大家介绍了5种常见的读取方式,文中的示例代码简洁易懂,大家可以根据自己的需要进... 目录1. 配置文件位置与加载顺序2. 读取配置文件的方式汇总方式一:使用 @Value 注解读取配置方式二

一文详解Java异常处理你都了解哪些知识

《一文详解Java异常处理你都了解哪些知识》:本文主要介绍Java异常处理的相关资料,包括异常的分类、捕获和处理异常的语法、常见的异常类型以及自定义异常的实现,文中通过代码介绍的非常详细,需要的朋... 目录前言一、什么是异常二、异常的分类2.1 受检异常2.2 非受检异常三、异常处理的语法3.1 try-

Java中的@SneakyThrows注解用法详解

《Java中的@SneakyThrows注解用法详解》:本文主要介绍Java中的@SneakyThrows注解用法的相关资料,Lombok的@SneakyThrows注解简化了Java方法中的异常... 目录前言一、@SneakyThrows 简介1.1 什么是 Lombok?二、@SneakyThrows