今天主要是来讲讲关于js最底层的基础知识,把握每个细节,做一个真正了解前端的前端。
主要涵盖js数据类型,js对象,数组,字符串,函数,请君侧耳听
一. Js数据类型:
Js数据类型分类 | 明细 |
---|---|
基本数据类型 | String ,Number,Boolean,Undefined,Null |
复杂数据类型 | Object,Array,Function |
二.Js对象
- 使用直接量创建对象
// bad
var item = new Object();
// good
var item = {};
2.不要使用保留字作为键名,它们在IE8下不工作
// bad
var superman = {
default: { clark: 'kent' },
private: true
};
// good
var superman = {
defaults: { clark: 'kent' },
hidden: true
};
3.使用同义词替换需要使用的保留字
// bad
var superman = {
class: 'alien'
};
// bad
var superman = {
klass: 'alien'
};
// good
var superman = {
type: 'alien'
};
3.数组
1.向数组增加元素时使用 Array#push 来替代直接赋值
var someStack = [];
// bad
someStack[someStack.length] = 'abracadabra';
// good
someStack.push('abracadabra');
2.当你需要拷贝数组时,使用 Array#slice
var len = items.length;
var itemsCopy = [];
var i;
// bad
for (i = 0; i < len; i++) {
itemsCopy[i] = items[i];
}
// good
itemsCopy = items.slice();
4.字符串
1.使用单引号 ’ ’ 包裹字符串
// bad
var name = "Bob Parr";
// good
var name = 'Bob Parr';
// bad
var fullName = "Bob " + this.lastName;
// good
var fullName = 'Bob ' + this.lastName;
2.超过 100 个字符的字符串应该使用连接符写成多行
3.注:若过度使用,通过连接符连接的长字符串可能会影响性能
// 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.';
4.程序化生成的字符串使用 Array#join 连接而不是使用连接符。尤其是 IE 下:
var items;
var messages;
var length;
var 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++) {
// use direct assignment in this case because we're micro-optimizing.
items[i] = '<li>' + messages[i].message + '</li>';
}
return '<ul>' + items.join('') + '</ul>';
}
5.函数(函数声明,函数表达式)
1.函数表达式
// 匿名函数表达式
var anonymous = function() {
return true;
};
// 命名函数表达式
var named = function named() {
return true;
};
// 立即调用的函数表达式(IIFE)
(function () {
console.log('Welcome to the Internet. Please follow me.');
}());
永远不要在一个非函数代码块(if、while 等)中声明一个函数,浏览器允许你这么做,但它们的解析表现不一致,正确的做法是:在块外定义一个变量,然后将函数赋值给它
2.ECMA-262 把 块 定义为一组语句。函数声明不是语句
// bad
if (currentUser) {
function test() {
console.log('Nope.');
}
}
// good
var test;
if (currentUser) {
test = function test() {
console.log('Yup.');
};
}
3.永远不要把参数命名为 arguments。这将取代函数作用域内的 arguments 对象
// bad
function nope(name, options, arguments) {
// ...stuff...
}
// good
function yup(name, options, args) {
// ...stuff...
}