javascript – 我们是否仍然需要ES6中的原型才能在所有类实例中共享一个方法副本?

前端之家收集整理的这篇文章主要介绍了javascript – 我们是否仍然需要ES6中的原型才能在所有类实例中共享一个方法副本?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
更新2:这个问题很乱,因为我认为ES6类没有修改.protototype,它确实如此,因此这正是我想要的.

我接受了最广泛的答案,即使所有的答案和评论都应该指出我在一开始就正确的方向:)

谢谢你们!

旧:

在旧的JS,ES6之前,当我们学习制作“类”时:

function X() {
    this.foo = function(){
    }
}; 
var x = new X();

我们也知道每次我们做x = new X();我们得到了’foo’方法的副本,在每个实例中这都是使用原型的一个好主意的原因之一.

现在,在ES6中我们有了这个新的酷类语法,但是具有相同的“问题”,即这里复制了’f’方法.我们如何以ES6方式避免它?或者我们还需要使用.prototype吗?

class X{
  f(){
    return 'f';
  }
}

console.clear();
let x1 = new X();
let x2 = new X();
x2.f = function() {return 'changed f';};

console.log(x1.f());//f
console.log(x2.f());//changed f

更新

我知道我们仍然可以使用.prototype.我的问题更多的是使用更现代的方式来实现我想要的,即没有方法的副本.我检查了关于JS原型的第一个教程,如果我的英语很差:)找到一个引文:) – 发现于https://hackernoon.com/prototypes-in-javascript-5bba2990e04b

(…) i.e. every object created using the constructor function will have it’s own copy of properties and methods. It doesn’t make sense to have two instances of function fullName that do the same thing. Storing separate instances of function for each objects results into wastage of memory. We will see as we move forward how we can solve this issue.

而且你还提到过class …只是一个语法糖,但是为什么……下面的函数FC,我们可以看到直接在fc1中看到“f”方法,并且

function FC() {
    this.v = 42;
    this.f = function(){
    }
}; 

var fc1 = new FC();

console.log('fc1,we can see the "f" directly in fc1: ',Object.getOwnPropertyNames(fc1)
);


//////////////////////////////////

class X{
  constructor(){
    this.v  = 'bar';
  }
  f(){
    return 'f';
  }
}


let x1 = new X();

console.log('x1,we don\'t,because we have it in prototype:',Object.getOwnPropertyNames(x1)
);

解决方法

ES6类是已在ES5中使用的已建立继承模式的语法糖.

ES6类通过设计使用原型方法.一个方法在实例之间共享,因此在原型对象上定义一次并在实例中原型继承它是合理的.原型在现代引擎中始终如一地优化,并且在某些情况下显示performance benefits,因此在适当的情况下它们可以是首选.

My question was more about using a more modern way to achieve what I wanted,i.e. not having copies of methods.

通过重用功能可以减少内存占用.这不是一种“现代”方式,只是解决问题的一种方法

function function f(){}
function FC() {
    this.v = 42;
    this.f = f;
};

“现代”方式是使用原型成员.

FC函数不是X类的直接对应物,因为前者在实例上赋予f,而不是构造函数原型.直接对应物(除了f描述符,在ES6类中也是不可枚举的)将是:

function FC() {
    this.v = 42;
}; 
FC.prototype.f = function(){};

class X{
  constructor(){
    this.v  = 'bar';
  }
  f(){}
}
// typeof X.prototype.f === 'function'

这种风格在ES5中没有得到一致使用的原因是因为this.f需要更少的字符来输入,并且可能比FC.prototype.f更具可读性,而开发人员可能不知道原型的好处和怪癖.

原型成员(方法和getter / setter)的推广是类语法糖解决的几个问题之一.

原文链接:https://www.f2er.com/js/155345.html

猜你在找的JavaScript相关文章