有什么区别
var A = function () {
this.x = function () {
//do something
};
};
和
var A = function () { };
A.prototype.x = function () {
//do something
};
我想知道使用这些中的任何一个是否有任何优势,我应该走哪条路？
构造方法:
var Class = function () {
this.calc = function (a, b) {
return a + b;
};
};
原型方法:
var Class = function () {};
Class.prototype.calc = function (a, b) {
return a + b;
};
我不喜欢这样,使用原型,方法定义与类分开,我不知道是否有任何特定的原因我应该使用它而不是第一种方法.
此外,使用函数文字定义"类"是否有任何好处,而不仅仅是函数定义:
var Class = function () {};
VS
function Class () {};
谢谢!
我在这里阅读(Douglas Crockford)使用原型运算符向Javascript类添加方法也保存了内存.
然后我读到了John Resig的文章 "用一堆原型属性实例化一个函数是非常非常快的 ",但他是在谈论以标准方式使用原型,还是他在他的文章中谈论他的具体例子？
例如,正在创建此对象:
function Class1()
{
this.showMsg = function(string) { alert(string); }
}
var c = new Class1();
c.showMsg();
比创建这个对象慢吗？
function Class1() {}
Class1.prototype.showMsg = function(string) { alert(string); }
var c = new Class1();
c.showMsg();
PS
我知道原型用于创建继承和单例对象等.但是这个问题与这些主题没有任何关系.
编辑:对于JS对象和JS静态对象之间的性能比较它可能感兴趣的人可以阅读下面的答案.静态对象肯定更快,显然只有在不需要多个对象实例时才能使用它们.
我正在构建request模块的复合,但是我不确定在JS for Node中构建对象的最佳实践是什么.
选项1:
function RequestComposite(request) {
return {
get: function (url) { return request.get(url); }
}
}
var comp = RequestComposite(request);
选项2:
function RequestComposite(request) {
this.request = request;
}
RequestComposite.prototype.get = function (url) { return this.request.get(url); };
var comp = new RequestComposite(request);
选项3:
var RequestComposite = {
init: function (request) { this.request = request; },
get: function (url) { return request.get(url); }
}
var comp = Object.create(RequestComposite).init(request);
我试图找到自己的方式,但是我对如何使用对象更加困惑...
如果我想为浏览器使用对象,答案会有所不同吗？
谢谢.
不确定这是否是一个新问题所以如果你有任何问题,请参考任何好的来源.
我的团队正在开发一个大型的JS图表项目,我们继承了之前的开发人员,他们大量使用内置对象原型来添加可重用的代码.我们在Date,Object和其他内部对象中添加了许多新的实用程序函数,所以我猜他们就这样了,因为改变原型会提供更直观的API.
另一方面,我们的组件会遇到性能/内存问题,我们会应用所有可能的优化和最佳实践.我找不到关于API设计的一个.我试图弄清楚是否最好使用库代码为内置对象构建原型,而不是通过某种命名空间模式将它们组合在专用对象中.
问题是哪种设计更好？并且他们中的一个会获得另一个的性能和/或记忆吗？
Date.prototype.my_custom_function = new function (...) {...};
var period = new Date();
period.my_custom_function();
VS
DateLib.my_custom_function // defined in a DateLib function
var period = new Date();
DateLib.my_custom_function(period);
谢谢,各位,任何帮助表示赞赏!
EDIt:主要的问题是我们的组件最终成为一个笨拙的JS野兽,减慢了一些移动设备,特别是旧的,如iPad1和早期的Androids ......我们已经做了很多优化,但我仍然看到几个有问题部分.我想确定内置的原型污染是否是另一个值得研究的候选者.特别是,这些Date人和大家Object都装满了典型的图书馆代码.例如,实际上它my_custom_function是一个很大的功能,它不是Date代码启动时唯一的原型.该Object更是加载.大多数客户端代码没有使用这些附加功能,它是故意使用的 - 所以我们将决定我们最好坚持使用哪种方式:
说实话,我还没有运行性能基准测试,一旦我有时间,我会做.如果有人有结果/想法会非常有帮助.
我一直在看的优秀克罗克福德上的JavaScript视频,到了他认为,使用点new运算符和<some object>.prototype可能会造成混淆,所以他提出的替代方案(如看到这里周围的一点00分40秒大关):
function gizmo(id) {
return {
id: id,
toString: function () {
return "gizmo " + this.id;
}
};
}
function hoozit(id) {
var that = gizmo(id);
that.test = function (testid) {
return testid === this.id;
};
return that;
}
人们可以确实认为这看起来更干净,你可以简单地通过调用或分别实例化gizmo和hoozit.但是,基于我对嵌套函数如何工作的理解,如果我在某个时刻有1000个hoozit实例,那么我将拥有1000个"副本" 和1000个"副本",而不是只添加其中一个如果添加了这些函数分别为Gizmo和hoozit的原型.gizmo()hoozit()toStringtest
Crockford提供这样一个良好实践的例子似乎很不寻常,所以我想知道这里是否有我遗漏的东西(例如一些隐藏的JS优化),还是仅仅是以性能为代价提高代码质量的情况？
编辑:由于melpomene在评论中指出这些嵌套函数是否是闭包可能很重要,请考虑下面的超级方法示例(相同的视频,几秒钟之后,稍微简化):
function hoozit(id) {
var that = gizmo(id);
var super_toString = …是否有一个可以替换以下函数的Array方法(类似的东西a.splice(some, tricky, arguments))？
function resize(arr, newSize, defaultValue) {
if (newSize > arr.length)
while(newSize > arr.length)
arr.push(defaultValue);
else
arr.length = newSize;
}
如果没有,是否有更好/更好/更短/实施？如果数组应该增长并且在shrink上删除值,则该函数应附加默认值.
到目前为止,我使用Revealing Module Pattern来构建我的Javascript,如下所示:
var module = (function() {
var privateVar;
// @public
function publicFunction( ) {
}
return {
publicFunction: publicFunction
}
})();
虽然这段代码按预期工作,但我最近读到一篇文章,如果你有多个实例,这个模式使用大量内存,并且与其他模式相比,它有一些速度问题.由于我喜欢使用这种模式,我在没有所有这些"问题"的情况下搜索了类似的模式,并且我遇到了Revealing Prototype Pattern.据我所知,JavaScript的Prototype具有更好的内存管理.
现在我想知道使用Revealing Prototype Pattern是否更快/更好的内存？这个基准让我感到惊讶,因为模块模式似乎要快得多.有什么缘故吗？
另外,我无法弄清楚如何使用Revealing Prototype Pattern创建多个实例(与上面的Revealing Module Pattern Fiddle相比):
var prototypeModule = function( el ) {
this.init( );
};
prototypeModule.prototype = function () {
var privateVar;
// @public
function init( ) {
}
return {
init: init
}
}();
我究竟做错了什么？
我典型的JS类结构如下所示:
MyClass = function(args)
{
this.myProp1 = undefined;
this.myProp2 = args[0];
//...more member data
this.foo = function()
{
return this.myProp1 + this.myProp2; //<- the problem.
}
//...more member functions
}
//if MyClass extends a superclass, add the following...
MyClass.prototype = Object.create(MySuperClass.prototype);
MyClass.prototype.constructor = MyClass;
...我对JS的持续烦恼是我似乎必须this在成员函数中不断使用才能访问这些函数所属的同一对象的属性.在this成员函数处理同一类/实例中的成员数据时,可以安全地省略其他几种语言,例如C#和Java .(我意识到JS的结构根本不同,因为它被设计为原型而不是分层继承语言.)
用另一种方式提出问题:有没有办法让未指明的范围不指向window,而是指当前的本地值this？
PS我猜这是一种语言限制,但我想我还是要再检查一下.
所以我打算建立一个小型图书馆，但这个问题有多种应用。
我想知道使用构造函数和类创建对象之间的区别。例如，这段代码...
function Thing (name) {
this.name = name;
this.doSomething = function (){};
alert("A new thing was created.");
}
var x = new Thing();
...以及这段代码...
class Thing {
constructor(name) {
this.name = name;
alert("A new thing was created.");
}
doSomething() {}
}
var x = new Thing();
...产生相同的结果，但以不同的方式。
但是，我更熟悉构造函数，但我需要使用 getter 和 setter 创建对象。尽管MDN将类定义为“语法糖”，但我不知道是否可以使用构造函数定义 getter 和 setter。
还有，女巫的性能是最好的？
注意：我不是指使用Thing.prototype. 我想知道构造函数和类之间的区别。
function Candy(name) {
this.name = name;
}
Candy.prototype.printName = function () {
console.log(this.name);
}
var chocolate = new Candy("chocolate");
chocolate.printName();
var gummyBears = new Candy("gummy bears");
gummyBears.printName();
这与不使用原型完全相同：
function Candy(name) {
this.name = name;
this.printName = function () {
console.log(this.name);
}
}
var chocolate = new Candy("chocolate");
chocolate.printName();
var gummyBears = new Candy("gummy bears");
gummyBears.printName();
所以我不确定使用原型的优势是什么！
javascript ×11
oop ×3
performance ×3
prototype ×3
this ×2
arrays ×1
class ×1
ecmascript-6 ×1
node.js ×1