【ES6】class静态方法

这篇具有很好参考价值的文章主要介绍了【ES6】class静态方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

类相当于实例的原型,所有在类中定义的方法,都会被实例继承。如果在一个方法前,加上static关键字,就表示该方法不会被实例继承,而是直接通过类来调用,这就称为“静态方法”。

class Foo {
  static classMethod() {
    return 'hello';
  }
}

Foo.classMethod() // 'hello'

var foo = new Foo();
foo.classMethod()
// TypeError: foo.classMethod is not a function

上面代码中,Foo类的classMethod方法前有static关键字,表明该方法是一个静态方法,可以直接在Foo类上调用(Foo.classMethod()),而不是在Foo类的实例上调用。如果在实例上调用静态方法,会抛出一个错误,表示不存在该方法。

注意,如果静态方法包含this关键字,这个this指的是类,而不是实例。

class Foo {
  static bar() {
    this.baz();
  }
  static baz() {
    console.log('hello');
  }
  baz() {
    console.log('world');
  }
}

Foo.bar() // hello

上面代码中,静态方法bar调用了this.baz,这里的this指的是Foo类,而不是Foo的实例,等同于调用Foo.baz。另外,从这个例子还可以看出,静态方法可以与非静态方法重名。

父类的静态方法,可以被子类继承。文章来源地址https://www.toymoban.com/news/detail-702888.html

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
}

Bar.classMethod() // 'hello'
上面代码中,父类Foo有一个静态方法,子类Bar可以调用这个方法。

静态方法也是可以从super对象上调用的。

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
  static classMethod() {
    return super.classMethod() + ', too';
  }
}

Bar.classMethod() // "hello, too"

到了这里,关于【ES6】class静态方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • JavaScript笔记——快速了解 ES6 新增数组方法,开箱即用(含案例)

    数组是 JavaScript 以及多数编程其他编程语言的一种基础数据类型。 ES6 提供了许多新的数组方法,这篇文章将介绍其中一些常用的数组方法及其使用示例。 Array.from() 方法从一个类似数组或可迭代对象中创建一个新的,浅拷贝的数组实例。例如,将字符串转换为字符数组。 A

    2024年02月10日
    浏览(45)
  • ES6学习-Class类

    constructor 构造方法 this 代表实例对象 方法之间不需要逗号分隔,加了会报错。 类的数据类型就是函数,类本身就指向构造函数。 类的所有方法都定义在类的 prototype 属性上面 类的内部所有定义的方法,都是不可枚举的(non-enumerable) ES6类内部定义的方法不可枚举;ES5可以

    2024年02月14日
    浏览(33)
  • ES6 中的类(class)

    ES6 引入的 class 具有定义类的能力。类是 ECMAScript 中新的基础性语法糖 。虽然 ES6 表面上看起来可以支持正式的面向对象编程,但实际上它背后使用的依旧是原型和构造函数的概念。(笔记内容参考《 JavaScript 高级程序设计(第 4 版)》章节 8.4 类 )。以前在笔记《

    2023年04月20日
    浏览(80)
  • es6(五)—— class(类)详解

    一:构造函数 在了解class (类)的使用之前,需要先了解一下什么是构造函数 1:定义:通常首字母大写,用于和普通函数区分(不大写也可以,但是前端为了更好区分使用大写)。 2:区别:构造函数和普通函数的区别就是调用方式的不同,普通函数是直接调用,而构造函

    2024年02月03日
    浏览(31)
  • ES6——class类实现继承

    赶快悄悄的努力起来吧,不苒在这里衷心祝愿各位大佬都能顺利通过面试。 面试专栏分享,感觉有用的小伙伴可以点个订阅,不定时更新相关面试题:面试专栏 。 在ES6 中新增了 extends ,用于实现类的继承。 MDN中对 extends 的解释是这么说的: **定义:**** exten

    2023年04月10日
    浏览(37)
  • JavaScript Es6_2笔记 (深入对象 + 内置构造函数 + 包装类型)+包含实例方法

    了解面向对象编程的基础概念及构造函数的作用,体会 JavaScript 一切皆对象的语言特征,掌握常见的对象属性和方法的使用。 了解面向对象编程中的一般概念 能够基于构造函数创建对象 理解 JavaScript 中一切皆对象的语言特征 理解引用对象类型值存储的的

    2024年02月12日
    浏览(47)
  • 【ES6】Class中this指向

    先上代码: 正常运行的代码: 输出: 单独调用函数printName: 输出: debugger调试一下,看看什么情况,调试代码: 调试界面,this显示undefined,在单独调用时,this的指向是undefined。在单独调用的场景下,要如何才能解决该问题呢?下面给出两种种比较简单的解决方法。 1、在

    2024年02月09日
    浏览(36)
  • ES5 构造函数与ES6 Class的区别

    Class 类中不存在变量提升 class内部会启用严格模式 class的所有方法都是不可枚举的 class 必须使用new调用 class 内部无法重写类名 class 的继承有两条继承链 一条是: 子类的__proto__ 指向父类 另一条: 子类prototype属性的__proto__属性指向父类的prototype属性. es6的子类可以通过__pro

    2024年02月06日
    浏览(106)
  • 【ES6】中构造函数的语法糖 —— Class(类)

            在现代前端开发中,JavaScript的面向对象编程成为了主流。ES6引入了class,使得开发者可以更方便地使用面向对象的方式编写代码,更接近传统语言的写法。ES6的class可以看作是一个语法糖,它的绝大部分功能ES5都可以做到,新的class写法只是让对象原型的写法更

    2024年02月16日
    浏览(33)
  • ES6之浅尝辄止1:class的用法

    class是es6新增的一种语法糖,用于简化js中构造类的过程

    2024年02月11日
    浏览(56)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包