工作笔记(五)

第五个工作笔记

1、 浏览器出错处理

错误类型：Error、RangeError、Reference和TypeError。

捕捉错误的目的在于避免浏览器以默认方式处理他们，而抛出错误的目的在于提供发生错误的具体原因。

2、判断一个对象是否为空

var obj = {};
if(JSON.stringfy(obj) == '{}') {
    console,log('这是一个空对象');
}

3、for...in和for...of

for...in	for...of
ES5标准	ES6标准
常用于循环对象	常用于循环数组
循环的是key	循环的是value

for...of是不能遍历普通对象的，可以通过和object.keys()搭配使用，先获取对象的所有key的数组再遍历。

var obj = {
    a: 1,
    b: 2
}
/* 错误用法 */
for(var i of obj) {
    console.log(i);
}
/*正确用法*/
for(var key of Object.keys(obj)) {
    console.log(obj[key]);
}

4、false值

在转化为布尔值时，转化为false:
空字符串"",
null,
undefined,
数字0，
数字NaN,
布尔值false

注意：

NaN == NaN 的值为false。

5、null和undefined转化情况

转化	null	undefined
转化为数字	0	NaN
转化为布尔值	false	false
转化为字符串	'null'	'undefined'

6、巧用filter给Array去重

arr = arr.filter(function(element, index, self) {
    return self.indexOf(element) == index;
})

7、解决文字和下划线重叠的问题

1）用CSS3解决

 a {
     text-decoration-skip: ink;
 }

2）使用border-botoom属性模拟

a {
    text-decoration: none;
    border-bottom: 1px solid;
}

3）使用box-shadow属性模拟

a {
    text-shadow: none;
    box-shadow: 0 1px;
}

8、取最近数值的几个函数

函数	值	使用方法
floor()	取小于或等于的最大整数	Math.floor(4.4)
ceil()	取大于或等于的最小整数	Math.deil(4.4)
round()	取最靠近指定值的整数	Math.round(4.4)

9、JQuery基础动画

函数	用法	作用
show()	show(3000)	展示元素
hide()	hide(3000)	隐藏元素
toggle()	toggle()	切换展示和隐藏元素
slideUp()	slideUp(3000)	垂直方向逐渐收起
slideDown()	slideDown(3000)	垂直方向逐渐展开
slideToggle()	slideToggle(3000)	切换垂直方向展示或收起元素
fadeIn()	fadeIn(3000)	淡入
fadeOut()	fadeOut(3000)	淡出
fadeToggle()	fadeToggle(3000)	切换淡入淡出

10、JQuery动画--Animate()

div.animate({
    opacity: 0.25,
    windth: '256px',
    height: '256px'
}, 3000);  // 在3s内达到CSS设定的值

回调函数：

div.animate({
     opacity: 0.25,
    windth: '256px',
    height: '256px'
}, 3000, function(){
    console.log('动画结束');
});

使用delay()可暂停动画。

注意：

对不是block属性的DOM元素无效，对background-color无效。

11、四种提交数据的方式(contentType属性)

1. application/x-www-form-urlencode

是form表单默认的提交方式，对key和value进行URL编码。

2. multipart/form-data

当表单中有type=file控件时，提交方式就会变为multipart/form-data。浏览器会把整个表单以控件为单位分割，并为每个部分加上Content-Disposition(form-data或者file),Content-Type(默认为text/plain),name(控件name)等信息，并加上分割符(boundary) 。

3. application/json

使用json数据和后台交互，适合RESTful接口设计。

4. text/html

浏览器在获取到这种文件时会自动调用html的解析器对文件进行相应的处理。