Javascript 正确使用方法

今天在github 上面找到了一个关于如何正确使用javascript 来进行我们的程序开发.我就恬不知耻的来了个原创啊..坑爹啊.拿来和大家分享一下吧.

A mostly reasonable approach to Javascript.

Types //类型

Objects //对象

Arrays //数组

Strings //字符串

Functions //函数

Properties //属性

Variables //变量

Hoisting //变量提升

Conditional Expressions & Equality //条件表达式和等式.

Blocks //块代码

Comments //注释

Whitespace //空格

Commas  //逗号

Semicolons //分号

Type Casting & Coercion //类型转换

Naming Conventions //命名规则

Accessors //访问

Constructors //构造器

Events //时间

Modules //模型

jQuery //

ECMAScript 5 Compatibility //ECMA 5 兼容

Testing //测试

Performance //性能

Resources //资源

In the Wild

Translation

The JavaScript Style Guide Guide

Contributors

License

Types (类型)

原始类型: 当访问一个原始类型的时候,其实直接访问该原始类型的内容.

string

number

boolean

null

undefined

var foo = 1,

bar = foo;

bar = 9;

console.log(foo,bar); //=> 1,9

复杂类型: 当你访问一个复杂类型数据类型的时候,其实是通过引用访问该变量的值.

object

array

function

var foo = [1,2];

bar = foo;

bar[0] = 9;

console.log(foo[0],bar[0]); // => 9,9

object(对象)

使用对象字面量来创建对象 (literal)

//bad

var item = new Object();

//good

var item = {};

不要使用保留关键字作为对象的属性名.这在IE8下无法工作.

//bad

var superman = {

default: {clark: ‘kent‘},

private: true

};

//good

var superman = {

defaults: {clark: ‘kent‘},

hidden: true

};

array(数组)

同样使用 字面量方法来创建数组

//bad

var items = new Array();

//good

var items = [];

如果你不知道数组的长度,那么使用Array的内置方法push进行插入操作

var someStack = [];

//bad

someStack[someStack.length] = ‘vein‘;

//good

someStack.push(‘vein‘);

当你想要拷贝一个数组的时候,使用array.slice

var len = items.length, //指的就是上面的内容...

itemCopy = [],

i;

//bad

for(i = 0; i < len ; ++i){

itemCopy[i] = items[i];

}

//good

itemCopy = items.slice(); //这里要注意了.这个我还真不知道...

Strings 字符串

使用单引号 (single quotes ) 来包围字符串...//这里我没有找到合适的关于性能方面的解释,我个人也喜欢这么用,(穿的少总比穿得多好看点吧..你懂得..)

//bad

var name = "Bob Parr";

//good

var name = ‘Bob Parr‘;

//bad

var fullName = "Bob " + this.lastName;

//good

var fullName = ‘Bob ‘ + this.lastName;

字符串长于80个字符的时候需要使用字符串连接在多行进行编写..注意,如果过度使用,连接字符串将会影响性能(performance)

// bad

var errorMessage = ‘This is a super long error that was thrown because of Batman. When you stop to think about how Batman had anything to do with this, you would get nowhere fast.‘;

// bad

var errorMessage = ‘This is a super long error that was thrown because \

of Batman. When you stop to think about how Batman had anything to do \

with this, you would get nowhere \

fast.‘;

// good

var errorMessage = ‘This is a super long error that was thrown because ‘ +

‘of Batman. When you stop to think about how Batman had anything to do ‘ +

‘with this, you would get nowhere fast.‘;

如果是有计划的 建立一个数组,像下面这样.使用Array.join 效果会更好..

var items,

messages,

length,

i;

messages = [{

stat: ‘success‘,

message: ‘ This one worked‘

},{

stat: ‘success‘,

message: ‘ This one worked‘

},{

stat: ‘success‘,

message: ‘ This one worked‘

}

];

length = messages.length;

//bad

function inbox(messages){

items = ‘<ul>‘;

for (i = 0; i < length; i++) {

items += ‘<li>‘ + messages[i].message + ‘</li>‘;

}

return items + ‘</ul>‘;

}

//good

function inbox(messages){

items = [];

for( i = 0; i < length ; i++){

items[i] = messages[i].message;

}

return ‘<ul><li>‘ + items.join(‘</li><li>‘) + ‘</li></ul>‘;

}

函数(Functions)

//匿名函数表达式..

var anonymous = function(){

return true;

};

// 命名函数表达式.

var named = function named(){

return true;

};

//即时引用函数

(function(){

console.log(‘Welcome to the Internet. Please follow me.‘);

})();

永远不要在非函数的块代码(if,while)中定义函数.相应的,在代码块中间函数赋值给外部的变量名..

//bad

if(currentUser){

function test(){

console.log(‘Nope.‘);

}

}

//good

var test;

if(currentUser){

test = function(){

console.log(‘Yup‘);

};  //be careful with the semi-colon.

}

Properties (属性)

使用点语法来访问属性.

var luke = {

jedi: true,

age: 28

};

//bad

var isJedi = luke[‘jedi‘];

//good

var isJedi = luck.jedi;

当使用变量访问对象属性时,使用 [] 方括号来访问

var luke = {

jedi: true,

age: 28

};

function getProp(prop) {

return luke[prop];

}

var isJedi = getProp(‘jedi‘);

下一篇接着来....

Best wishes..

Javascript 正确使用方法

时间: 2024-11-03 20:50:31

Javascript 正确使用方法的相关文章

Javascript 正确使用方法 二

好的,废话不多说,接着上篇来. 变量(variables) 始终使用 var 关键字来定义变量,如果不这样将会导致 变量全局化,造成污染. //bad superPower = new SuperPower(); //good var superPower = new SuperPower(); 使用 一个 var关键字来定义多个变量...并且每个变量一行.. // bad var items = getItems(); var goSportsTeam = true; var dragonba

深入了解javascript的sort方法

在javascript中,数组对象有一个有趣的方法 sort,它接收一个类型为函数的参数作为排序的依据.这意味着开发者只需要关注如何比较两个值的大小,而不用管"排序"这件事内部是如何实现的.不过了解一下sort的内部实现也不是一件坏事,何不深入了解一下呢? 算法课上,我们会接触很多种排序算法,什么冒泡排序.选择排序.快速排序.堆排序等等.那么javascript的 sort方法采用哪种排序算法呢?要搞清楚这个问题,呃,直接看v8源代码好了.v8中对 Array.sort的实现是采用ja

JavaScript String 字符串方法

JavaScript String 字符串方法汇总 1.str.indexOf() 方法查找字符串中的字符串  返回   字符串中指定文本首次出现的索引(位置) JavaScript 从零计算位置.0 是字符串中的第一个位置,1 是第二个,2 是第三个 ... 无法设置更强大的搜索值(正则表达式) var str = "The full name of China is the People's Republic of China."; var pos = str.indexOf(&q

html,JavaScript调用winfrom方法

---恢复内容开始--- 目的: 在动画上面添加点击事件,通过JavaScript调用winfrom方法 1.创建一个页面 using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; usin

SQL Server附加数据库出现错误5123的正确解决方法

SQL Server附加数据库出现错误5123的正确解决方法 因为自己有一本基于SQL Server 2005的数据库教程,里边使用的示例数据库是AdventureWorks for SQL Server 2005,而我的机子上装的是SQL Server 2008,示例数据库是AdventureWorks for SQL Server 2008.起初我以为示例数据库AdventureWorks for SQL Server 2005 与AdventureWorks for SQL Server

AspectJ学习笔记2-Eclipse中AspectJ插件AJDT的正确安装方法

接着之前一篇日志.这个事情也挺无语的,简单记录一下. 在这里:http://www.eclipse.org/ajdt/ 可以下载最新的Eclipse Plugin,下载解压之后,一般来说,直接把解压后文件夹下的features和plugins放到Eclipse的文件夹下就行了.不过我这样做以后,启动Eclipse,发现没什么作用.才参考网上有人介绍的第二种方法,也就是Help--Install New Software--Add--Local这种方式选择刚才的解压文件夹,但是这样操作以后会报像下

Javascript 常用扩展方法

这篇文章纯粹是为了保存这些方法,供以后翻阅,其实一直保存在 evernote 里面,但觉得还是放到对的地方会好点. 现在收录的很少,希望以后会慢慢增多. 数组扩展 contains,remove 扩展 1 function ArrayContains(array, obj) { 2 for (var i = 0; i < array.length; i++) { 3 if (array[i] === obj) { 4 return true ; 5 } 6 } 7 return false ;

delegate实现Javascript的each方法

C#如何用delegate实现Javascript的each方法 C#中有很多易混淆的关键词,例如delegate,Func, Action和 Predicate.Func, Action和 Predicate本质上都是delegate,下面看一下delegate概念. 1 delegate概念 delegate本质上就是一个指向函数的指针,可以指向不同的函数,只要函数的签名和代理一致即可. 2 delegate应用 其实Func, Action, Predicate等都是delegate,只是

[13年迁移]javascript 的join(&quot;&quot;)方法,把数组变成统一字符串,用来写长的输出字符串

javascript 的join("")方法,把数组变成统一字符串,用来写长的参数字符串    function m(a) {        var b = ["<table class='DynarchCalendar-topCont'", j, "><tr><td>", "<div class='DynarchCalendar'>", e ? "<a clas