关于 js的一些书写习惯实用风格小技巧-CSDN博客

//使用空格来提升阅读性

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 ] );
    }

转载于:https://my.oschina.net/felumanman/blog/205876