我正在将代码组织成20-60行模块,通常是模块模式.我想要一个结构良好的面向对象的JavaScript库.
我喜欢它,因为程序员可以从库中提取模块并根据需要使用它们,它们是自包含的.
这是工具,消息,效果和文本,全部包含在NS中.
题？
这是组织我的图书馆的好方法(最佳实践)吗？
注意
到目前为止,评论和答案中有0个共识……非常令人沮丧.
外模块模式
var NS = ( function ( window,undefined )
{
/* All Modules below here */
} )( window );
工具
/**
*Tools
* getTimeLapse - benchmark for adding
*/
var Tool = ( function ()
{
var Tool = function ( )
{
};
Tool.prototype.getTimeLapse = function( numberOfAdds )
{
var end_time;
var start_time = new Date().getTime();
var index = 0;
while ( index <= numberOfAdds )
{
index++;
}
end_time = new Date().getTime();
return ( end_time - start_time );
};
return Tool;
} () );
信息
/**
*Message
* element - holds the element to send the message to via .innerHTML
* type - determines the message to send
*/
var Message = ( function ()
{
var messages =
{
name: 'Please enter a valid name',email: 'Please enter a valid email',email_s: 'Please enter a valid email.',pass: 'Please enter passoword,6-40 characters',url: 'Please enter a valid url',title: 'Please enter a valid title',tweet: 'Please enter a valid tweet',empty: 'Please complete all fields',same: 'Please make emails equal',taken: 'Sorry,that email is taken',validate: 'Please contact 效果
/**
*Effects
* element - holds the element to fade
* direction - determines which way to fade the element
* max_time - length of the fade
*/
var Effects = ( function ()
{
var Effects = function ( element )
{
this.element = element;
};
Effects.prototype.fade = function( direction,max_time )
{
var element = this.element;
element.elapsed = 0;
clearTimeout( element.timeout_id );
function next()
{
element.elapsed += 10;
if ( direction === 'up' )
{
element.style.opacity = element.elapsed / max_time;
}
else if ( direction === 'down' )
{
element.style.opacity = ( max_time - element.elapsed ) / max_time;
}
if ( element.elapsed <= max_time )
{
element.timeout_id = setTimeout( next,10 );
}
}
next();
};
return Effects;
} () );
文本
/**
*Text
* form_elment - holds text to check
*/
var Text = ( function ()
{
var Text = function ( form_element )
{
this.text_array = form_element.elements;
};
Text.prototype.patterns =
{
prefix_url: /^(http:)|(https:)\/\//,aml: /<(.+)_([a-z]){1}>$/,url: /^.{1,2048}$/,tweet: /^.{1,40}$/,title: /^.{1,32}$/,name: /^.{1,64}$/,email: /^.{1,64}@.{1,255}$/,pass: /^.{6,20}$/
};
Text.prototype.checkPattern = function( type )
{
return this.patterns[ type ].exec( this.text_array[type].value );
};
Text.prototype.checkUrl = function( type )
{
return this.patterns[ type ].exec( this.text_array.url.value );
};
Text.prototype.checkSameEmail = function()
{
return ( ( this.text_array.email.value ) === ( this.text_array.email1.value ) );
};
Text.prototype.checkEmpty = function()
{
for ( var index = 0; index < this.text_array.length; ++index )
{
if ( this.text_array[ index ].value === '')
{
return 0;
}
}
return 1;
};
return Text;
} () );
最佳答案
我建议改变以使代码更清洁并减少其占用空间的一件事是立即设置原型属性,这样做而不是做
原文链接：https://www.f2er.com/js/429561.htmlObject.prototype.method1 = function(){};
Object.prototype.method2 = function(){};
你做
Object.prototype = {
method1: function(){},method2: function(){}
};
如果您需要保留建议的构造函数引用,则应该在之后重新分配构造函数. See this answer for more details.
