您的位置:首页 > Web前端 > JavaScript

Javascript 风格向导

2013-04-21 22:13 357 查看


  大部分针对Javascript最合理的方法归纳。

类型

• 原始类型:我们可以直接使用值。
  ο  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


 

Objects

• 使用{}创建对象。

// bad
var item = new Object();

// good
var item = {};


• 不要使用保留字作为关键字。

// bad
var superman = {
class: 'superhero',
default: { clark: 'kent' },
private: true
};

// good
var superman = {
klass: 'superhero',
defaults: { clark: 'kent' },
hidden: true
};


Arrays

• 使用[]创建数组

// bad
var items = new Array();

// good
var items = [];


• 如果你不知道数组长度,使用Array#push。

var someStack = [];

// bad
someStack[someStack.length] = 'abracadabra';

// good
someStack.push('abracadabra');


• 当你需要复制数组的时候,请使用Array#slice。

var len = items.length,
itemsCopy = [],
i;

// bad
for (i = 0; i < len; i++) {
itemsCopy[i] = items[i];
}

// good
itemsCopy = items.slice();


Strings
• 对于字符串,我们使用单引号''。

// bad
var name = "Bob Parr";

// good
var name = 'Bob Parr';

// bad
var fullName = "Bob " + this.lastName;

// good
var fullName = 'Bob ' + this.lastName;


• 超过80个字符的字符串,我们使用串联符号(\),让字符串多行显示。

• 注意:如果过度使用带串联符号的字符可能会影响到性能。


 

// 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 代替字符串连接。尤其是对IE浏览器。

var items,
messages,
length, i;

messages = [{
state: 'success',
message: 'This one worked.'
},{
state: 'success',
message: 'This one worked as well.'
},{
state: 'error',
message: 'This one did not work.'
}];

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
• 函数表达式

// anonymous function expression
var anonymous = function() {
return true;
};

// named function expression
var named = function named() {
return true;
};

// immediately-invoked function expression (IIFE)
(function() {
console.log('Welcome to the Internet. Please follow me.');
})();


• 绝对不要在非函数块(if,while)申明一个函数。我们可以把函数申明变成一个函数表达式。

// bad
if (currentUser) {
function test() {
console.log('Nope.');
}
}

// good
if (currentUser) {
var test = function test() {
console.log('Yup.');
};
}


• 绝对不要把一个参数命名为arguments,arguments参数是函数作用域内给出的一个特殊变量,如果你把参数命名为arguments,那么这个参数就会覆盖它原有的特殊变量。

// bad
function nope(name, options, arguments) {
// ...stuff...
}

// good
function yup(name, options, args) {
// ...stuff...
}


总结

  这些很多是大家都比较清楚的,平时经常用,我只是强调一下,让大家再复习一下。

  下一篇:Javascript 风格向导(续)

推荐



 

 

  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: