《Effective Javascript》笔记

1.了解你使用的javascript版本。

  • "use strict"只有在脚本或函数的顶部才能生效。
  • 应对代码连接,编写健壮代码的两个方案:
    1. 不要将进行严格模式检查和不进行严格模式检查的文件连接起来
    • 连接多个文件时,将自身包裹在立即调用的函数表达式中
// 最外层不进行严格模式检查
(function(){
        // file1.js
        "use strict"
        function(){
            // ...
        }
        // ...
})()
(function(){
        // file2.js没有进行严格模式检查
        function(){
            var arguments = [];
            // ...
        }
})()
  • 要获得最大兼容性,最简单的方法是在严格模式下编写代码,并显式的将代码包裹在本地启用了严格模式的函数中。
(function(){
        'use strict';
        function f(){
             //...
        }
        //...
})()

2.理解Javascript浮点数

  • JavaScript中所有的数字都是双精度浮点数
  • 位运算符将数字视为32位的有符号整数
  • 浮点运算只能四舍五入到最接近的可表示的实数,尽可能采用整数值运算
(0.1 + 0.2) + 0.3; // 0.6000000000000001
0.1 + (0.2 + 0.3); // 0.6

3.当心隐式的强制转换

  • JavaScript将值强制转换为期望的类型。
3 + true; // 4
"2" + 3; // "23"
(1 + 2) + "3"; // "33"
"17" * 3; // 51
"8" | "1"; // 9
  • 一个未定义的变量将被转换为特殊的浮点数值NaN,NaN是唯一一个不等于其自身的值。
isNaN(Nan); //true
isNaN("foo"); // true
isNaN(undefined); // true
isNaN({}); // true
isNaN({valueof: "foo"}); // true
function isReallyNaN(x){
    return x !== x;
}
  • 对象可以被强制转换为原始值。最常见的用法是转换为字符串(通过隐式调用自身的toString方法)。
"the Math object: " + Math; // "the Math object: [object Math]"
  • 对象通过valueOf方法强制转换为数字,通过toString()方法强制转换为字符串。
  • 具有valueOf方法的对象应该实现一个toString方法,返回一个valueOf方法产生的数字的字符串表示。
  • 测试一个值是否为未定义的值,应该使用typeOf或者与undefined比较而不是使用真值运算。JavaScript中有7个假值: false、0、-0、""、NaN、null、undefined。
function point(x, y){
    if( !x ){
        x = 320;
    }
    if( !y ){
        y = 240;
    }
    return { x: x, y: y }
}
point(0,0); // 忽略任何假值参数,包括0,结果为{ x: 320, y: 240 } 

对比下面的typeof检查方式

function point(x, y){
    if(typeof x === "undefined"){
        x = 320;
    }
    if(typeof y === "undefined"){
        y = 240;
    }
    return { x: x, y: y }
}
point(); // { x: 320, y: 240 }
point(0,0); // { x: 0, y: 0 }

4.原始类型优于封装

JavaScript除了布尔、数字、字符串、null、undefined是原始值类型外,其余的全是对象。但是typeof(null)得到的结果却是'object',ECMAScript标准描述这是一个独特类型。标准库提供了构造函数来封装布尔值、数字、字符串作为对象。

var s = "hello"
var so = new String("hello");//封装字符串的String对象
typeof s // "string"
typeof so; // object

不能使用内置操作符比较两个String对象,因为每个String对象都只等于自身:

"hello"==="hello"; //true

var s1 = new String("hello")
var s2 = new String("hello")
s1===s2; // false
s1==s2; //false

对原始值提取属性和进行方法调用时,它表现的像使用了对应对象类型封装了该值一样。例如,String对象的方法,对原始字符串也可以调用那个。

"hello".toUpperCase(); // "HELLO"
// 对比下面的调用
"hello".someProperty =17; // 封装成对象A
"hello".someProperty; // 封装成对象B,undefined

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

下面是一个隐式强制转换的例子,运算符两边都被强制转换为数字1。

"1.0e0" == { valueOf: function(){ return true; } }; // true

当两个参数属于同一类型时,==和===运算符可以互换,但最好严格使用相等运算符。对比下面三个版本的代码:
bad

var today = new Date();
if(form.month.value == (today.getMonth() + 1) && form.day.value == today.getDate()){}

better: 显示使用Number函数或一元运算符+将值转换为数字

var today = new Date();
if(+form.month.value == (today.getMonth() + 1) && +form.day.value == today.getDate()){}

best: 使用严格相等运算符

var today = new Date();
if(form.month.value === (today.getMonth() + 1) && form.day.value === today.getDate()){}

6.了解分号插入的局限

  • 分号仅在}标记之前一个或多个换行之后程序输入的结尾被插入。
  • 分号仅在随后的输入标记不能解析时插入。

你可能会想,只要不省略分号就没事了。事实上不是这样。接下来是个JavaScript语法限制产生式(restricted production),它不允许两个字符之间出现换行。最危险的是return语句,在return关键字和其可选参数之间不能包含换行符。

return {}; // 返回新对象
//
return
{}; // 出现换行符被解析为3条语句 return, {}, ;
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容