技术栈

主页 > 前端开发 >

看effective js学习心得

技术栈 - 中国领先的IT技术门户

[Toc]

让自己习惯javascript

1. 使用IIFE(Immediately Invoked Function Expression)的方式连接多个文件

(function(){
    //file1.js
    "use strict";
    function(){
        //...
    }
})();
(function(){
    //file2.js
    //不使用严格模式
    function f(){
        var arguments=[]
        //...
    }
})

2. 浮点数的计算不准确,可将浮点数按比例转为整数进行计算

(0.1+0.2)+0.3!==0.1+(0.2+0.3)
(1+2)+3===1+(2+3)

3. 当心隐式的强制转换

'2'+3;//'23'
2+'3';//'23'
1+2+'3';//'33'
(1+'2')+'3';//'123'
'17'*3;//51
'8'|'1';//9
'String:'+Math;//"String:[object Math]"
//对象通过valueOf方法转换为数字,toString方法转化为字符串
//运算符+ 对象的时候盲目优先使用valueOf方法,没有再使用toString方法
//Boolean转换的7个假值包括:false,0,-0,"",NaN,null,undefined,其他均为真值
//判断参数是否为undefined
typeof x==='undefined'
x===undefined

4. 使用原始类型,不使用封装对象

var s1=new String('hello')
var s2=new String('hello')
s1==s2//false
s1===s2//false
//隐式创建封装对象是临时的,每次封装都会产生一个新的String对象,不会造成持久影响
"hello".songProperty=17
"hello".someProperty//undefined

5. 避免对混合类型使用==运算符,使用===运算符

参数类型1参数类型 2强制转换
nulltrue不转换,总是返回true
null或defined其他任何非null或defined的类型不转换,总是返回false
原始类型:string,number或
boolean
Date对象将原始类型转化为数字;Date对象转化
为原始类型(先尝试toString方法,再尝
试valueOf方法)
原始类型:string,number或
boolean
非Date对象将原始类型转化为数字;Date对象转化
为原始类型(先尝试valueOf方法,再尝
试toString方法)
原始类型:string,number或
boolean
原始类型:string,number或
boolean
将原始类型转化为数字

6. 省略分号的局限

  1. 只能在一行、一个代码块和一段程序结束的地方省略分号
  2. 分号插入是一种错误校正机制(仅在随后的输入标记不能解析时插入)
    注意5个明确有问题的字符:( [ + - /
a=b
(f(n))
//会被解析成
a=b(f(n))

a=b
f()
//会被解析成
a=b;
f(n);

最安全的选择是防御性地增加分号:

;(function(){
    
})()
;(function(){
    
})()

return、带有显示标签的break/continue、后置自增或自减运算符 后的换行会强制自动地插入分号

return
{}
;
//等价于
return;
{}
;

a
++      //++不能出现在换行前
b
//等价于
a;
++b;
  1. 分号不会作为分隔符在for循环语句的头部被自动插入(以及空循环体的while循环)
//以下会解析错误
for(var i=0,total=1
i<n
i++){
    total*=i
}

function infiniteLoop(){while(true)}
//要显示分号
function infiniteLoop(){while(true);}

7. javascript视字符串为16位的代码单元序列

ES6提供了codePointAt()和String.fromCodePoint()来识别32位的码点,使用for of遍历和正确获得相应字符
ES6增加了u修饰符来正确处理大于uFFFF的Unicode字符

var s = " 
                
责任编辑:admin  二维码分享:
本文标签: functionvarreturnprototype...函数
点击我更换图片

评论列表