更新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)的推广是类语法糖解决的几个问题之一.

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

  1. 内置UIControl的iOS原型单元

    到目前为止,我只需要实现具有预定义设计(正常,副标题等)的原型单元,这不是问题.现在我需要实现原型单元,其中包含一些控件,如分段开关,开关或任何其他.问题是我无法找到触发的动作是如何实现的以及它们与控件的关系.此外,我还没有找到任何关于如何在单个UITableViewController中实现不同原型单元的示例.我知道这是一个普遍的问题,但我会在这里感谢一些指点.也许有人知道一些文档,教程等等.好

  2. 第四章 :构建你的应用程序原型

    在应用程序开发的环境下,原型可以是一个app的早期样品,这个样品没有什么功能只有一些用户界面甚至只有草图。原型可以允许你在不构建应用程序的情况下测试你的idea。下图展示原型的好处将应用程序的草图画在纸上现在你有一个idea,怎么构建原型呢?使用POP构建你的应用程序prototype你可以把你的app话在纸上。如前所述,应用程序原型有很多形式。

  3. Swift设计模式之原型模式

    转自Swift设计模式原文Design-Patterns-In-Swift

  4. swift+storyboard+UIImageview入门

    更新记录:该Storyboard教程由CarolineBegbie更新iOS8和Swift相关内容。Storyboard是最先在iOS5引入的一项振奋人心的特性,大幅缩减构建App用户界面所需的时间。要介绍Storyboard是什么,我打算从这张图讲起。这就是使用Storyboard的力量。Storyboard通过新的原型表项和静态表项特性,让处理表视图的工作更加轻松。Storyboard使自动布局更易用。接下来我们看一下Storyboard,点击项目浏览器中的Main.storyboard就可以在Int

  5. swift设计模式学习 - 原型模式

    原型模式的基本实现上图是最基本的原型模式的结构图,下面将用Swift代码来实现一个基本原型模式:不知道大家有没哟发现,这个设计模式我们在代码中经常会用到,那就是NScopying协议,通过这个协议来实现对象的深拷贝,下面我们就用NScopying来实现一下。原型模式解决实际问题上面是通过NScopying来实现原型模式的例子,一下是使用过程:以下是打印的结果:以上是我对于原型模式的理解,如果有不对的地方欢迎大家交流,最后谢谢大家的阅读~~

  6. 适用于Android和iOS的快速应用原型制作工具

    解决方法JustInMind怎么样?

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

    更新2:这个问题很乱,因为我认为ES6类没有修改.protototype,它确实如此,因此这正是我想要的.我接受了最广泛的答案,即使所有的答案和评论都应该指出我在一开始就正确的方向:)谢谢你们!更新我知道我们仍然可以使用.prototype.我的问题更多的是使用更现代的方式来实现我想要的,即没有方法的副本.我检查了关于JS原型的第一个教程,如果我的英语很差:)找到一个引文:)–发现于https://hackernoon.com/prototypes-in-javascript-5bba2990e04b:(

  8. javascript – 基于原型的语言

    我真的是javascript的忠实粉丝.它真的是一个伟大的基于原型的OOP语言.现在我想学习一些其他基于原型的语言.真的对一些设计指南感兴趣,即如何在没有课程等的情况下管理代码.我应该选择哪种语言?

  9. Javascript:没有原型的函数

    javascript中的内置函数没有“prototype”属性.但是,function(){…}或newFunction()将生成构造函数以及原型.是不是太贵了?有可能在javascript中创建纯函数而不是构造函数吗?

  10. javascript – 原型与类

    史蒂夫·叶格(SteveYegge)最近发布了一个关于他所说的通用设计模式的interestingblogpost.在那里,他将使用原型作为建模工具,而不是类.我喜欢与继承相比引入更少耦合的方式.但是,通过使用类来实现类,而不是继承,这也是类可以得到的.其他任何人都有使用原型的成功案例,也许有助于解释与类相比,原型的使用优势.我想这是静态建模与动态建模,但更多的例子将是非常受欢迎的.解决方法一个有

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部