ES6中的继承,String类型方法的拓展

ES6中的继承:

主要是依赖extends关键字来实现继承,使用了extends实现继承不一定要constructorsuper,因为没有的话会默认产生并调用它们。

在实现继承时,如果子类中有constructor函数,必须得在constructor中调用一下super函数,因为它就是用来产生实例this的。

super当成函数调用时,代表父类的构造函数,且返回的是子类的实例,也就是此时super内部的this指向子类。在子类的constructorsuper()就相当于是Parent.constructor.call(this)

javascript 复制代码
/**
 * ES6 继承 
 * 子类继承父类 
 * 子类原型对象继承父类原型对象
 */
class Animal{
  constructor(type,weight,length){
    this.type = type;
    this.weight = weight;
    this.length = length;
  }
  sayType(){
    console.log(this.type,'这是animal实例公共方法')
  }
  static AnimalAttr = 'Animal静态属性';
  static AnimalMethod = function(){
    console.log('这是Animal静态方法')
  }
}
// 子类使用extends关键字实现对父类得继承
class Dog extends Animal{
  // 如果子类提供了构造器必须显示调用super函数
  constructor(type,weight,length,name,color){
    super(type,weight,length);//类似于Animal.call()
    this.name = name;
    this.color = color;
  };
}
let d1 = new Dog('狗','40kg','20cm','可乐','白色');
console.log(d1);
d1.sayType();
console.log(Dog.AnimalAttr);
console.log(Dog.AnimalMethod());
// 子类对父类继承 
console.log(Dog.__proto__ === Animal);
// 子类原型对象继承父类得原型对象
console.log(Dog.prototype.__proto__ === Animal.prototype);
console.log(d1.constructor);

String类型方法的拓展

在ES5中所了解的String类型方法有charAt、charCodeAt、slice、upperCase、lowerCase、replace、split、indexOf、lastIndexOf····

ES6又对String类型方法进行了拓展:

1.trim

单独去除字符串前后空格

javascript 复制代码
let str = ' hello world ';
console.log(str.trim());
console.log(str);

单独去除前面空格 trimStart 别名trimLeft

javascript 复制代码
//单独去除前面空格 trimStart 别名trimLeft
console.log('2'+str.trimStart()+'2');
console.log('2'+str.trimLeft()+'2');

单独去除后面空格 trimEnd 别名trimRight

javascript 复制代码
// 单独去除后面空格 trimEnd 别名trimRight
console.log('2'+str.trimEnd()+'2')
console.log('2'+str.trimRight()+'2')
2.padStart

从头部添加字符串 填充字符串长度 填充字符(默认空格)

javascript 复制代码
// padStart 从头部添加字符串 填充字符串长度 填充字符(默认空格)
let str = 'es8';
console.log(str.padStart(4),'2'+str);
console.log(str.padStart(4,'h'));
console.log(str.padStart(2));//填充字符串长度小于源字符串长度 返回源字符串
console.log(str.padStart(6,'ab'));

代码运行结果如下:

3.padEnd

从尾部添加字符串 填充字符串长度 填充字符(默认空格)

javascript 复制代码
// padEnd 从尾部添加字符串 填充字符串长度 填充字符(默认空格)
console.log(str.padEnd(4)+'2');
console.log(str.padEnd(4,'h'));
console.log(str.padEnd(2));//填充字符串长度小于源字符串长度 返回源字符串
console.log(str.padEnd(6,'45'));

代码运行结果如下:

4.toString

将引用数据类型全部转为字符串显示

javascript 复制代码
function foo(){
  console.log('我是函数');
  // 我是函数内的注释
    return ;
}
console.log(foo.toString());

代码运行结果如下:

5.replaceAll

将字符串中的某个元素全部替换为另一个

javascript 复制代码
let str = 'hello';
console.log(str.replaceAll('l','L'));

代码运行结果如下:

相关推荐
忆往wu前17 分钟前
从0到1一步步拆解搭建,梳理一个 Vue3 简易图书后台全开发流程
前端·javascript·vue.js
木斯佳24 分钟前
前端八股文面经大全:字节抖音前端三面(2026-04-27)·面经深度解析
前端·面试·笔试·八股·面经
淘矿人30 分钟前
从0到1:用Claude启动你的第一个项目
开发语言·人工智能·git·python·github·php·pygame
cany100040 分钟前
C++ -- 模板的声明和定义
开发语言·c++
澈20740 分钟前
深耕进阶 Day1:C 与 C++ 核心差异 + C++ 入门基石
c语言·开发语言·c++
shao91851643 分钟前
第3章(2)——使用Gradio JavaScript Client
javascript·node.js·cdn·gradio·job·events·playcode
Felven1 小时前
C. Need More Arrays
c语言·开发语言
love530love1 小时前
Podman Machine 虚拟硬盘迁移实战二:用 Junction 把 vhdx 从 C 盘搬到其他盘
c语言·开发语言·人工智能·windows·wsl·podman·podman machine
光影少年1 小时前
大屏页面,一次多个请求,请求加密导致 点击 全局时间选择器 时出现卡顿咋解决(面板收起会延迟1~2秒)
前端·javascript·vue.js·学习·前端框架·echarts·reactjs
Mr.mjw1 小时前
vue中封装一个环形进度条组件,根据外部盒子大小自适应变化
前端·javascript·vue.js