深入理解 JavaScript 系列学习笔记

《深入理解 JavaScript 系列》连载于汤姆大叔的博客,源于对 O’Reilly 新书《JavaScript Patterns》的摘要。这里记录一些不错的知识点,巩固下 JavaScript 基础知识。

一、编写高质量 JavaScript 代码的基本要点

1)全局下的 this 始终指向 window 对象本身

2)避免创建隐式全局变量,如 var a = b = 0; 中 a 是本地变量,b 是全局变量

3)使用 var 创建的全局变量无法被删除,不通过 var 创建的隐式全局变量可以被删除

4)隐式全局变量并不是真正的全局变量,而是全局对象 window 的属性。属性可以使用 delete 操作符删除,而变量不能

5)函数内任意位置声明多个 var 语句,和在函数顶部声明作用一致,这种行为称为 hoisting(悬置/置顶解析/预解析)

6)数组使用正常的 for 循环,对象使用 for...in 枚举,遍历对象属性时使用 hasOwnProperty() 过滤掉原型链属性

7)为避免隐式类型转换,比较值和表达式类型时建议使用 === 和 !== 操作符

二、揭秘命名函数表达式

略…

三、全面解析 Module 模式

略…

四、立即调用的函数表达式

1)function(){ /* code */ }(); 报错是因为解析器解析 function 关键字时,默认认为是声明,而不是表达式

五、强大的原型和原型链

1)原型可以赋值任何类型的对象,但是不能赋值原子类型的值(注:原子类型?谁给解释下?)

2)检查对象上某个属性是自身属性还是原型链属性,除 hasOwnProperty 外别无他法,另外 hasOwnProperty 不受保护,可以被覆盖

六、S.O.L.I.D 五大原则之单一职责 SRP

略…

七、S.O.L.I.D 五大原则之开闭原则 OCP

略…

八、S.O.L.I.D 五大原则之里氏替换原则 LSP

略…

九、根本没有“JSON 对象”这回事!

1)字面量:固定值,可以从字面上理解脚本

1.1)字符串字面量由双引号(”)或单引号(’)包围起来的零个或多个字符组成

1.2)对象字面量由大括号({})括起来的零个或多个对象的属性键值对

十、JavaScript 核心(晋级高手必读篇)

1)如果某个原型对象的原型不为 null 值,称之为原型链(prototype chain)

十一、执行上下文(Execution Contexts)

略…

十二、变量对象(Variable Object)

1)全局对象(Global object)是进入任何执行上下文之前就已创建的对象,生命周期终止于程序退出

十三、This? Yes, this!

1)foo 和 foo.prototype.constructor 是同一引用

2)函数上下文中,this 由调用者提供,由调用函数的方式决定

3)内部函数被父函数调用,尽管 this 被设定为 null,但结果被隐式转化成 window

4)call 和 apply 第一参数均为 this,apply 第二参数是数组,而 call 接受任何参数

十四、作用域链(Scope Chain)

1)函数的的生命周期分为创建和激活阶段(调用时)

十五、函数(Functions)

略…

十六、闭包(Closures)

1)内部函数被构造,并能在函数外以返回值形式被获得,则构成闭包(简单理解为函数嵌套?)

十七、面向对象编程之一般理论

1)使用基于委托的原型实现面向对象,不支持多重继承,但可以使用混入(mix)的方式

十八、面向对象编程之 ECMAScript 实现

1)原始值类型包括 Undefined、Null、Boolean、String、Number,其余为对象类型

十九、求值策略(Evaluation strategy)

略…

二十、《你真懂JavaScript吗?》答案详解

略…

二十一、S.O.L.I.D 五大原则之接口隔离原则 ISP

略…

二十二、S.O.L.I.D 五大原则之依赖倒置原则 DIP

略…

二十三、JavaScript 与 DOM(上)——也适用于新手

1)IE 支持 defer 属性,加载完 HTML 文档后再执行 JS 代码

二十四、JavaScript 与 DOM(下)

略…

二十五、设计模式之单例模式

略…

二十六、设计模式之构造函数模式

1)构造函数作为函数调用时,如:

function Foo(url) {
    this.url = url;
}
var tom = Foo('mangguo.org');
console.log(tom);
输出结果为 undefined,原因是 Foo 构造函数的 caller 为 null,被隐式转化为 window 对象(参考第十三条中的第 3 点)

2)强制使用 new 关键字实例化构造函数:

if (!(this instanceof Foo)) {
    return new Foo(url);
}
二十七、设计模式之建造者模式

略…

二十八、设计模式之工厂模式

略…

二十九、设计模式之装饰者模式

略…

三十、设计模式之外观模式

略…

三十一、设计模式之代理模式

略…

三十二、设计模式之观察者模式

1)观察者模式即发布订阅模式(Publish/Subscribe),定义了一对多的关系,多个观察者对象同时监听某一主题对象,当该主题对象状态变化时会自动通知所有观察者(广播),触发观察者执行更新操作
2)当一个对象的改变需要同时改变其它对象,并且不知道具体有多少对象需要改变时,应考虑使用观察者模式

三十三、设计模式之策略模式

略…

三十四、设计模式之命令模式

略…

三十五、设计模式之迭代器模式

略…

三十六、设计模式之中介者模式

略…

三十七、设计模式之享元模式

略…

三十八、设计模式之职责链模式

略…

三十九、设计模式之适配器模式

略…

四十、设计模式之组合模式

略…

四十一、设计模式之模板方法

略…

四十二、设计模式之原型模式

略…

四十三、设计模式之状态模式

略…

四十四、设计模式之桥接模式

略…

四十五、代码复用模式(避免篇)

略…

四十六、代码复用模式(推荐篇)

略…

四十七、对象创建模式(上篇)

1)链模式支持连续调用一个对象的方法,比如 foo.add(1).minus(2).add(3) 这样的形式,实现思路是将 this 原样返回,如:

var foo = {
    value: 1,
    add: function (n) {
        this.value += n;
        return this;
    },
    minus: function (n) {
        this.value -= n;
        return this;
    }
};
四十八、对象创建模式(下篇)

1)类 YUI 的沙盒模式实现

最后更新 2012.04.28