jsのいくつかの書く習慣の実用的な風格の小さい技巧について

3623 ワード

//読解力向上にスペースを使う
if ( condition ) {
    //   
}

while ( condition ) {
    //
}

for (var i = 0; i < 100; i++ ) {
    //    
}
  
var i,
    length = 10;
for ( i = 0; i < length; i++) {
    //
}
  
var i = 0,
    length = 10;
for ( ; i<length; i++ ) {
    //    
}

var prop;
for ( prop in object ) {
    //
}

if ( true ) {
    //
} else {
    //
}

//代入、宣言、関数(命名関数、関数式、構築関数)
var foo = 'bar',
    num = 1,
    undef;

//      
var array = [];
    object = {};
  
var //      
foo = "",
bar = "",
quux;

//      
function foo ( arg1, arg2 ) {
    
}

foo( arg1, arg2 );

//     
var test = function ( number ) {
    return number * number;
};

//          
var test = function test( number ) {
    if ( number < 2 ) {
        return 1;
    }
    return number * test( number-1 );
};

//    
function FooBar( options ) {
    this.options = options;
}
var fooBar = new FooBar({ a:"alpha" });
fooBar.options;
//{ a: "alpha" }

C異常詳細
//    'array'
foo([ "alpha", "beta" ]);

//    'object'
foo({
    a:"alpha",
    b:"beta"
});

//    'string'
foo("bar");

//         ,    
if ( !("foo" in obj) ){
    
}

//引用符は、単一またはデュアルを選択してもjavascriptでは解析に違いがなく、一貫性を保つように選択します.
//検査!!!!!!!!
//null
variable === null;

//null or undefined:
varible == null

//undefined
    
typeof varible === "undefined"
    
varible === undefined

//  
object.prop === undefined
object.hasOwnProperty( prop )
"prop" in object

変換タイプ
var number = 1,
    string = "1",
    bool = false;

number;
//1

number + "";
//"1"

string;
//"1"

+string;
// 1

+string++;
//1

bool;
//false

+bool;
//0

bool + "";
//"false"

var num = 2.5;
parseInt( num, 10 );
//    ...

~~num;
num >> 0;
num >>> 0;
//    2

//       ...
var neg = -2.5;
parseInt( neg, 10);
//   ...
~~neg;
neg >> 0;
     -2;

neg >>> 0;
//    4294967294

コントラスト演算
    
if ( !foo )
//         0, "", null, undefined, NaN

実用的なスタイル
(function( global ){
    var Module = (function(){

        var data = "secret";
        
        return {
            bool: true,
            string: "a string",
            array: [ 1, 2, 3, 4],
            object: {
                lang: "en-Us"
            },
            getData: function(){
                return data;
            },
            setData: function( value ){
                return ( data = value );
            }
        };
    })()

    //           
    global.Module = Module;

})( this )

実用的な構築関数
(function( global ){

    function Ctor( foo ) {
        this.foo = foo;
        return this; 
    }
    
    Ctor.prototype.getFoo = function() {
        return this.foo;
    }

    Ctor.prototype.setFoo = function( val ) {
        return ( this.foo =val );        
    }
    
    //    new        ,       :
    var ctor = function( foo ){
        return new Ctor( foo );
    };

    //               
    global.ctor = ctor;    
    
})( this )

//修正されたサンプルコードは比較的はっきりしている
function query( selector ) {
    return document.querySelectorAll( selector );
}

var idx = 0,
    elements = [],
    matches = query('#foo'),
    length = matches.length;

    for( ; idx < length; idx++ ){
        elements.push( matches[ idx ] );
    }