可以使用哪些技术在JavaScript中定义类,它们的权衡是什么?

JavaScript

Green逆天

2020-03-11

我更喜欢将OOP用于目前正在从事的大型项目中。我需要用JavaScript创建几个类,但是,如果我没记错的话,至少有两种方法可以做到这一点。语法是什么,为什么要用这种方式呢?

我想避免使用第三方库-至少在一开始。
在寻找其他答案时,我找到了文章“ 使用JavaScript进行面向对象的编程”,第I部分:继承-文档JavaScript,该文章讨论了JavaScript中的面向对象的编程。有更好的继承方法吗?

第691篇《可以使用哪些技术在JavaScript中定义类,它们的权衡是什么?》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

4个回答
Gil前端 2020.03.11

MooTools (My Object Oriented Tools) is centered on the idea of classes. You can even extend and implement with inheritance.

When mastered, it makes for ridiculously reusable, powerful javascript.

Gil飞云 2020.03.11
var Student = (function () {
    function Student(firstname, lastname) {
        this.firstname = firstname;
        this.lastname = lastname;
        this.fullname = firstname + " " + lastname;
    }

    Student.prototype.sayMyName = function () {
        return this.fullname;
    };

    return Student;
}());

var user = new Student("Jane", "User");
var user_fullname = user.sayMyName();

Thats the way TypeScript compiles class with constructor to JavaScript.

乐理查德 2020.03.11

ES2015课程

在ES2015规范中,您可以使用类语法,它只是原型系统的基础。

class Person {
  constructor(name) {
    this.name = name;
  }
  toString() {
    return `My name is ${ this.name }.`;
  }
}

class Employee extends Person {
  constructor(name, hours) {
    super(name);
    this.hours = hours;
  }
  toString() {
    return `${ super.toString() } I work ${ this.hours } hours.`;
  }
}

好处

主要优点是静态分析工具发现更容易针对此语法。对于其他来自基于类的语言的人,使用该语言作为多语言也更容易。

注意事项

警惕其当前的局限性。要获得私有属性,必须使用Symbols或WeakMaps在将来的版本中,很可能会将类扩展为包括这些缺少的功能。

支持

浏览器支持是不是现在(通过IE除外几乎每个人都支持)很不错,但你可以像现在transpiler使用这些功能巴贝尔

资源资源

村村A小卤蛋 2020.03.11

在JavaScript中定义类的最好方法是不定义类。

说真的

有几种不同的面向对象风格,其中一些是:

  • 基于类的OO(由Smalltalk首次引入)
  • 基于原型的OO(由Self首次引入)
  • 基于多方法的OO(我认为是CommonLoops首次引入的)
  • 基于谓词的面向对象(不知道)

可能还有其他我不认识的人。

JavaScript实现了基于原型的OO。在基于原型的OO中,通过复制其他对象(而不是从类模板实例化)来创建新对象,并且方法直接存在于对象中而不是类中。继承是通过委派完成的:如果对象没有方法或属性,则在其原型(即从其克隆的对象)上查找该对象,然后在该原型的原型上进行查找,依此类推。

换句话说:没有类。

JavaScript实际上对该模型有一个很好的调整:构造函数。可以说,不仅可以通过复制现有对象来创建对象,还可以“凭空”构造它们。如果使用new关键字调用一个函数,则该函数将成为构造函数,而该this关键字将不会指向当前对象,而是指向一个新创建的“空”对象。因此,您可以根据自己的喜好配置对象。这样,JavaScript构造函数就可以在传统的基于类的OO中担当类的角色之一:充当新对象的模板或蓝图。

现在,JavaScript是一种非常强大的语言,因此,如果需要,在JavaScript中实现基于类的OO系统非常容易但是,只有在确实有需要时才应该这样做,而不仅仅是因为Java就是这样做的。

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android