我将我的代码组织成 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 <a class="d" href="mailto:foo@foo.com">support</a> to reset your password',
};
var Message = function (element)
{
this.element = element;
};
Message.prototype.display = function( type )
{
this.element.innerHTML = messages[ type ];
};
return Message;
} () );
效果
/**
*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;
} () );