命名空间的正确用法是javascript应用程序?

时间:2016-12-15 02:55:04

标签: javascript design-patterns javascript-objects

我最近开始了一个新项目。为了提高我的JavaScript技能,我决定使用命名空间(基于对象)编写代码。

我决定只使用这种模式,因为我发现它很容易(对于我的水平)并且清楚地读写。

以下是编写应用程序的好方法吗?

<!DOCTYPE HTML>
<html>
<head>
    <style type="text/css">
        .wrapper {background-color:#eee;}

        .column {
            width:25%;
            height:100%;
            display:table-cell;
            vertical-align:top;
        }

        .block_1 {background-color:#aaf;}

        .block_2 {
            width:50%;
            background-color:#afa;              
        }

        img {width:100%;}

        .block_3 {background-color:#faa;}   

        .row {
            width:100%;
            height:50%;
            vertical-align:top;    
            display:inline-table;
        }
        .a {
            height:30%;
            background-color:#ccf;              
        }
        .b {
            height:70%;
            background-color:#aac;              
        }
        .c {background-color:#fcc;} 
        .d {background-color:#caa;}
    </style>
</head>

<body>
    <nav class="navbar navbar-main">(navbar goes here)</nav>
    <div class="wrapper">

        <div class="column block_1">
            <div class="row a">row a</div>
            <div class="row b">row b</div>          
        </div>

        <div class="column block_2">
            <img src="images/homepage.jpg" class="img-responsive" alt="Home page image">
        </div>

        <div class="column block_3">
            <div class="row c">row c</div>
            <div class="row d">row d</div>          
        </div>

    </div>
</body>

我也对使用函数表达式感兴趣,如:

var APP = APP || {};
APP.myProperty = {
    firstMethod: function(){
        // magic happens here...
    },
    secondMethod: function(){
        // more magic...
    }
}
APP.myProperty.myFirstMethod();
APP.myProperty.mySecondMethod();

非常感谢您的反馈!感谢

0 个答案:

没有答案