JavaScript扩展:字符串方法、数组去重及继承实现
需积分: 9 76 浏览量
更新于2024-12-26
收藏 1007B ZIP 举报
1. 给String增加方法
在JavaScript中,可以使用原型链来给String类型增加新的方法。原型链是JavaScript的核心概念之一,允许我们向现有的对象类型添加新的属性和方法。通过扩展String的原型,我们可以为所有字符串实例添加自定义的方法。例如,可以创建一个千分位格式化的函数,方便地格式化数字字符串为更易读的形式。
示例代码如下:
```javascript
// 给String原型增加一个thousandFormat方法来实现千分位格式化
String.prototype.thousandFormat = function() {
return this.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
};
// 使用新增的thousandFormat方法
let numberStr = "1234567890";
let formattedStr = numberStr.thousandFormat(); // 输出 "1,234,567,890"
```
2. 去重
在处理数组或集合数据时,常常需要去重。JavaScript提供了几种不同的方法来实现数组去重,包括使用`Set`对象、使用`filter`方法结合`indexOf`或`includes`方法、以及使用`reduce`方法。
示例代码如下:
使用`Set`对象去重:
```javascript
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = [...new Set(arr)]; // [1, 2, 3, 4, 5]
```
使用`filter`和`indexOf`去重:
```javascript
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = arr.filter((item, index, self) => self.indexOf(item) === index);
```
使用`reduce`方法去重:
```javascript
let arr = [1, 2, 2, 3, 4, 4, 5];
let uniqueArr = arr.reduce((acc, current) => {
if (acc.indexOf(current) < 0) {
acc.push(current);
}
return acc;
}, []);
```
3. 继承
JavaScript中的继承可以通过原型链(prototype chain)、构造函数和原型的组合、或者使用ES6引入的`class`关键字来实现。继承允许一个类(或函数)获取另一个类(或函数)的属性和方法。
使用原型链实现继承的示例:
```javascript
function Parent(name) {
this.name = name;
}
Parent.prototype.sayName = function() {
console.log(this.name);
};
function Child(name, age) {
Parent.call(this, name); // 调用父类构造函数
this.age = age;
}
// 继承Parent的原型属性和方法
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;
let child = new Child('Alice', 12);
child.sayName(); // 输出 "Alice"
```
使用ES6类实现继承的示例:
```javascript
class Parent {
constructor(name) {
this.name = name;
}
sayName() {
console.log(this.name);
}
}
class Child extends Parent {
constructor(name, age) {
super(name); // 调用父类的构造函数
this.age = age;
}
}
let child = new Child('Bob', 13);
child.sayName(); // 输出 "Bob"
```
在上述代码中,`Child`类通过`extends`关键字继承了`Parent`类的属性和方法,并通过`super`关键字调用了父类的构造函数。这是ES6中推荐的继承方式,更加简洁和易于理解。
以上就是基于标题和描述所提到的知识点,具体实现细节和代码示例。需要注意的是,在实际项目中,需要根据具体需求选择合适的实现方式。例如,`Set`去重虽然简洁,但在不支持ES6的环境中可能需要polyfill。而继承方面,如果项目环境仍然需要支持IE等老旧浏览器,可能需要使用传统的构造函数和原型链组合的方式。
2013-01-31 上传
212 浏览量
2021-05-06 上传
165 浏览量
108 浏览量
2021-06-19 上传
2021-05-01 上传
1032 浏览量
110 浏览量

weixin_38687277
- 粉丝: 10
最新资源
- AuroraGT_9upk: GameLoft新动作编辑器工具解析
- 郑阿奇数据库实用教程电子教案全集
- Wandermarks-crx: 组织位置书签的浏览器扩展工具
- 基于MATLAB的感兴趣区域图像检索技术研究
- 安卓学习必看:植物大战僵尸简单版源码
- Java Web第六章课后习题答案解析及Oracle数据库应用
- TQ2440SKY2440Jlink使用与调试详细教程
- Wrike快速视图功能及新任务创建指南
- 全面掌握IBM p系列管理员认证(Test 191)
- 西门子高阶产品选型工具使用指南
- DS18B20温度传感器仿真实验及Proteus电路搭建
- VB控件自由拖拽实现技术解析
- 深入了解Delphi常用组件及其应用
- AM3358 Linux4.4 U-Boot 2016.09引导文件包下载
- GDL1-crx插件:高效管理Chrome书签的扩展程序
- 全面解析移动通信技术:从基础到CDMA系统