JavaScript:Class.method与Class.prototype.method

JavaScript

2020-03-12

以下两个声明有什么区别?

Class.method = function () { /* code */ }
Class.prototype.method = function () { /* code using this.values */ }

是否可以将第一条语句视为静态方法的声明,而将第二条语句视为实例方法的声明,可以吗?

第1248篇《JavaScript:Class.method与Class.prototype.method》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

2个回答
小胖Itachi 2020.03.12

是的,第一个是static method也称为class method,而第二个是instance method

考虑以下示例,以更详细地理解它。

在ES5中

function Person(firstName, lastName) {
   this.firstName = firstName;
   this.lastName = lastName;
}

Person.isPerson = function(obj) {
   return obj.constructor === Person;
}

Person.prototype.sayHi = function() {
   return "Hi " + this.firstName;
}

在上面的代码中,isPerson是的静态方法,sayHi而是的实例方法Person

下面是如何从Person构造函数创建对象

var aminu = new Person("Aminu", "Abubakar");

使用静态方法isPerson

Person.isPerson(aminu); // will return true

使用实例方法sayHi

aminu.sayHi(); // will return "Hi Aminu"

在ES6中

class Person {
   constructor(firstName, lastName) {
      this.firstName = firstName;
      this.lastName = lastName;
   }

   static isPerson(obj) {
      return obj.constructor === Person;
   }

   sayHi() {
      return `Hi ${this.firstName}`;
   }
}

看看如何使用static关键字声明静态方法isPerson

创建Person的对象

const aminu = new Person("Aminu", "Abubakar");

使用静态方法isPerson

Person.isPerson(aminu); // will return true

使用实例方法sayHi

aminu.sayHi(); // will return "Hi Aminu"

注意:这两个示例本质上是相同的,JavaScript仍然是一种无类语言。class中介绍ES6主要是在现有的基于原型的继承模型是语法糖。

乐米亚 2020.03.12

当创建多个MyClass实例时,内存中仍然仍然只有一个publicMethod实例,但是如果使用privateMethod,则最终将创建大量实例,而staticMethod与对象实例没有任何关系。

这就是原型节省内存的原因。

另外,如果您更改父对象的属性,并且未更改子对象的相应属性,则会对其进行更新。

问题类别

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