JavaScript组织|模块模式w /模块

前端之家收集整理的这篇文章主要介绍了JavaScript组织|模块模式w /模块前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在将代码组织成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.html

猜你在找的JavaScript相关文章