| 文章标题 | 你根本不懂Javascript（EP1～EP3.5 基础课） |
| 发布日期 | 2017-02-18 |
| 文章分类 | Tech |
| 相关标签 | #JS |
做全栈许久, 因为负责的方面多因此各语言都没有掌握精髓。因此准备翻看一些真正权威并且全面的书进行查缺补漏，计划从前端开始玩，近日在读《Javascript 权威指南》，发觉自己居然有如此之多的部分全然不知，不禁一句感叹「你根本不懂 Javascript！」
原本这只是个人笔记，记录一些自己错过的基础知识。和某大牛交谈过程中，被推荐将笔记公开并创造与大众交流心得的可能性，故将此文发布了出来。
ECMAScript 有 5 种原始类型（primitive type）
基本类型（null, undefined, bool, number, string）应该是值类型，没有属性和方法。
Javascript 有一系列内置对象来创建语言的基本功能，具体有如下几种
true 或 false。0、-0、null、""、false、undefined 或 NaN，则该对象设置为 false。否则设置为 true（即使 value 参数是字符串 false）。Boolean 对象包括 toString 和 valueOf 方法， Boolean 最常用于在 条件语句中 true 或 false 值的简单判断，布尔值和条件语句的组合提供了一种使用 Javascript 创建逻辑的方式。
Number 对象是一个数值包装器，该对象包含几个只读属性:
Number 对象还有一些方法，可以用这些方法对数值进行格式化或进行转换:
String 对象是文本值的包装器。除了存储文本，String 对象包含一个属性和各种 方法来操作或收集有关文本的信息，String 对象不需要进行实例化便能够使用。
String 对象只有一个只读的length属性用于返回字符串的长度。
除了上面三个对象，Javascript 还拥有 Date、Array、Math 等内置对象，这三个经常显示使用，所以非常熟悉，知道了内置对象就可以看看上面例子是怎么回事儿了。
只要是引用了字符串的属性和方法，Javascript 就会将字符串值通过 new String(s)的方式转为内置对象 String，一旦引用结束，这个对象就会销毁。所以上面代码在使用的实际上是 String 对象的 length 属性和 indexOf 方法。
同样的道理，数字和布尔值的处理也类似。null 和 undefined 没有对应对象。
既然有对象生成，能不能这样:
var s='this is a string';
s.len=10; //创建了一个临时的 String 对象，随即销毁
alert(s.len); //第三行代码又会创建一个新的临时对象, 并没有返回 10，而是 undefined！a = 1;
a.s = 2;
a.s// 一样 undefined
Javascript 会在必要时将包装对象转换为原始值因此显示创建的对象和其对应的原始值常常但不总是表现的一样。
==运算符将原始值和其包装对象视为相等；===全等运算符将他们视为不等；Javascript 中的原始值（undefined、null、布尔值、数字和字符串）与对象（包括数组和函数）有着根本区别。
原始值是不可更改的：任何方法都无法更改（或突变）一个原始值。
对数字和布尔值来说显然如此——改变数字的值本身就说不通，而对字符串来说就不那么明显了，因为字符串看起来像由字符组成的数组，我们期望可以通过指定索引来假改字符串中的字符。
实际上，Javascript 是禁止这样做的。字符串中所有的方法看上去返回了一个修改后的字符串，实际上返回的是一个新的字符串值。
//字符串原始值修改不了
var str = "abc";
str[0] = "d";
console.log(str[1]="f"); //>>f
console.log(str[0]); //>>a
console.log(str); //>>abc
原始值的比较是值的比较, 但是对象是引用类型, 因此可以看成是地址的比较
var a = {'x' : 1}, b = {'x' : 1};
alert(a === b);//false, 值相同但是地址不同
var c = [1], d = [1];
alert(c === d);//false, 同上
所有对象继承了以下两个转换方法：
它的作用是返回一个反映这个对象的字符串。默认的 toString()方法并不会返回一个有趣的值。
很多类定义了特定版本的 toString()方法：
数组的 toString() 方法将每个数组元素转换为一个字符串，并在元素之间添加逗号合并成结果字符串
函数类的 toString() 方法返回这个函数的实现定义的表示方式。通常是将用户定义的函数转换为 Javascript 源代码字符串
日期类 toString() 返回一个可读的日期和时间字符串。
RegExp 类的 toString() 将返回 RegExp 对象转换为表示正则表达式直接量字符串。
[1,2,3].toString()//=>`1,2,3`
(function(x){f(x);}).toString()//=>` function(x){\nf(x);\n}`
/\d+/g.toString()//=>`/\\d+/g`
newDate(2010,0,1).toString() //=>`Fri Jan 01 2010 00:00:00 GMT-0800(PST)`
对象是复合值，而且大多数对象无法真正表示一个原始值。数组、函数和正则表达式简单地继承了这个默认方法，调用这些类型的实例的 valueOf()方法只是简单地返回对象本身。日期类的 valueOf 方法会返回一个内部表示：1970 年 1 月 1 日以来的毫秒数
通常情况下对象是通过 toString()和 valueOf()方法，就可以做到对象到字符串和对象到数字的转换。
逻辑很清晰，先试试
toString()能否获得正确的值，如果不行再试试valueOf()，否则报错。
以上是翻译的原文，可能有些难读，不过其实也很容易理解：先试试
valueOf()然后再试试toString()，否则报错。
+运算符可以进行加法或者字符串连接操作。如果其中一个操作数是对象，那么就会将对象转为原始值而不是执行对象到数字的转换。==操作符类似，如果对象和一个原始值进行比较， 那个对象也会转换成一个原始值。另外，日期类型是一种特殊的情况，日期是 Javascript 语言核心中唯一的预先定义类型。**对于所有非日期对象，对象到原始值的转换基本上是对象到数字的转换（首先调用 valueOf()），日期对象则使用对象到字符串的转换模式。**并且，通过 valueOf()或者 toString()返回的原始值将本地直接使用而不会被强制转换为数字或字符串。==一样,<运算符以及其它关系算术运算符也会做到对象到原始值得转换，但是如果是日期对象则会使用上方粗体字的特殊的逻辑。因此除了日期对象之外的任何对象比较都会先尝试调用 valueOf, 然后调用 toString。不管得到的原始值是否直接使用，它都不会进一步被转换为数字或字符串。+、==、!=关系运算符是唯一执行特殊的字符串到原始值的转换方式的运算符。其它运算符到特定类型的转换很明确,而且对日期对象来讲也没有特殊情况。例如-运算符把它的两个操作数都转换为数字。日期对象各种运算的结果:
var now=new Date();
console.log(typeof (now+1)); //string +号把日期转换为字符串
//对于加号操作符，我们会将操作对象转换为字符串然后进行计算
console.log(typeof (now-1)); //number -号把对象到数字的转换
//对于减号操作符，我们会将操作对象转换为数字然后进行计算
console.log(now==now.toString()); //true
//对于比较操作符，我们一般会优先转换为原始值再进行比较
//但是日期类型例外！和日期对象相比较会转换成字符串再进行比较
console.log(now>now-1);//true >把日期转换为数字
undefined，不是null，不是null，不是null！所有末定义直接赋值的变量自动声明为拥有全局作用域
一般情况下，window 对象的内置属性都拥有全局作用域，例如 window.name、window.location、window.top 等等。
尽管在全局作用域编写代码时可以不写 var 语句，但声明局部变量时则必须使用 var 语句。
scope = "global"; // 声明一个全局变量，甚至不用 var 来声明
function checkscope2() {
scope = "local"; // 糟糕！我们刚修改了全局变量
myscope = "local"; // 这里显式地声明了一个新的全局变量
return [scope, myscope];// 返回两个值
}
console.log(checkscope2()); // ["local", "local"]，产生了副作用
console.log(scope); // "local"，全局变量修改了
console.log(myscope); // "local"，全局命名空间搞乱了
函数定义是可以嵌套的。
var scope = "global scope"; // 全局变量
function checkscope() {
var scope = "local scope"; //局部变量
function nested() {
var scope = "nested scope"; // 嵌套作用域内的局部变量
return scope; // 返回当前作用域内的值
}
return nested();
}
console.log(checkscope()); // "nested scope"
**在一些类似 C 语言的编程语言中，花括号内的每一段代码都具有各自的作用域，而且变量在声明它们的代码段之外是不可见的，我们称为块级作用域（block scope），而 Javascript 中没有块级作用域。**Javascript 取而代之地使用了函数作用域（function scope），变量在声明它们的函数体以及这个函数体嵌套的任意函数体内都是有定义的。
在如下所示的代码中，在不同位置定义了变量 i、j 和 k，它们都在同一个作用域内，这三个变量在函数体内均是有定义的。
function test(o) {
var i = 0; // i 在整个函数体内均是有定义的
if (typeof o == "object") {
var j = 0; // j 在函数体内是有定义的，不仅仅是在这个代码段内
for (var k = 0; k < 10; k++) { // k 在函数体内是有定义的，不仅仅是在循环内
console.log(k); // 输出数字 0~9
}
console.log(k); // k 已经定义了，输出 10
}
console.log(j); // j 已经定义了，但可能没有初始化
}
**Javascript 的函数作用域是指在函数内声明的所有变量在函数体内始终是可见的。**有意思的是，这意味着变量在声明之前甚至已经可用。Javascript 的这个特性被非正式地称为声明提前（hoisting），即 Javascript 函数里声明的所有变量（但不涉及赋值）都被「提前」至函数体的顶部，看一下如下代码：
var scope = "global";
function f() {
console.log(scope); // 输出"undefined"，而不是"global"
//因为在这个作用域里面局部变量已经覆盖了全局变量，但是还没有执行到
var scope = "local"; // 变量在这里赋初始值，但变量本身在函数体内任何地方均是有定义的
console.log(scope); // 输出"local"
}
你可能会误以为函数中的第一行会输出 "global"，因为代码还没有执行到 var 语句声明局部变量的地方。**其实不然，由于函数作用域的特性，局部变量在整个函数体始终是有定义的，也就是说，在函数体内局部变量遮盖了同名全局变量。**尽管如此，**只有在程序执行到 var 语句的时候，局部变量才会被真正赋值。**因此，上述过程等价于：将函数内的变量声明「提前」至函数体顶部，同时变量初始化留在原来的位置：
function f() { var scope; // 在函数顶部声明了局部变量 console.log(scope); // 变量存在，但其值是"undefined" scope = "local"; // 这里将其初始化并赋值 console.log(scope); // 这里它具有了我们所期望的值 }
在具有块级作用域的编程语言中，在狭小的作用域里让变量声明和使用变量的代码尽可能靠近彼此，通常来讲，这是一个非常不错的编程习惯。由于 Javascript 没有块级作用域，因此一些程序员特意将变量声明放在函数体顶部，而不是将声明靠近放在使用变量之处。这种做法使得他们的源代码非常清晰地反映了真实的变量作用域。
当声明一个 Javascript 全局变量时，实际上是定义了全局对象的一个属性。
**当使用 var 声明一个变量时，创建的这个属性是不可配置的，也就是说这个变量无法通过 delete 运算符来删除。**可能你已经注意到，如果你没有使用严格模式并给一个未声明的变量赋值的话，Javascript 会自动创建一个全局变量。以这种方式创建的变量是全局对象的正常可本会属性，并可以删除它们：
var a =1;
b =2;
this.b2 = 3;
delete a; //不可删除
delete b; //可删除
delete this.b2 //可删除
Javascript 全局变量是全局对象的属性，这是在 ECMAScript 5 规范称为「声明上下文对象。Javascript 可以允许用 this 关键字来引用全局对象，却没有方法可以引用局部变量中存放的对象。这种存放局部变量的对象的特有性质，是一种对我们不可见的内部实现。然而，这些局部变量对象存在的观念是非常重要的。
原始表达式分为三种：1. 直接量
1.23 //数字直接量 "hello" //字符串直接量 /pattern/ //正则表达式直接量
true //返回一个布尔值：真
false //返回一个布尔值：假
null //返回一个值：空
this //返回「当前」对象
i //返回变量 i 的值
sum //返回 sum 的值
undefined //undefined 是全局变量，和 null 不同，它不是一个关键字
对象和数组初始化表达式实际上是一个创建新的对象和数组。
因为数组本身就是一个对象
[] //一个空数组：[]内留空即表示该数组没有任何元素
[1+2,3+4] //拥有两个元素的数组，第一个是 3，第二个是 7
var matrix =[[1,2,3],[4,5,6],[7,8,9]];//数组的初始化可以嵌套
var a = new Array(1,2,3)
a = [1,2,3]
var a = new Array(1,,2,3)//报错
a = [1,,2,3]//index=1 的元素是 undefined
var a = new Array(10)//创建一个长度为 10 的数组并且值全部为 undefined
a = [10]//创建了一个长度为 1 的数组并且值为 10
一个典型的函数定义表达式包含关键字 function，跟随其后的是一对圆括号，括号内是一个以逗号分隔的列表，列表含有 0 个或多个标识符(参数名)，然后再跟随一个由花括号包裹的 JS 代码段(函数体)，如：
var o = {x:1,y:{z:3}}; //一个示例对象
var a = [o,4,[5,6]]; //一个包含这个对象的示例数组
o.x //=>1：表达式 o 的 x 属性
o.y.z //=>3：表达式 o.y 的 z 属性
o["x"] //=>1：对象 o 的 x 属性
a[1] //=>4：表达式 a 中索引为 1 的元素
a[2]["1"] //=>6：表达式 a[2]中索引为 1 的元素
a[1+1][0+1] //=>6：表达式 a[2]中索引为 1 的元素，大括号里的数据运算后并且转换为了字符串
a[0].x //1：表达式 a[0]的 x 属性
相关运算逻辑：
null或者undefined,表达式会抛出一个类型错误异常，因为这两个值都不能包含任意属性。undefined。如果属性名称是一个保留字或者包含空格和标志点符号，或是一个数字(对于数组来说)，则必须使用方括号的写法。 当属性名是通过运算得出的而不是固定值的时候，这时必须使用方括号写法。
调用表达式以一个函数表达式开始，这个函数表达式指代了要调用的函数。函数表达式后跟随一对圆括号，括号内是一个以逗号隔开的参数列表，如：
f(0) //f 是一个函数表达式；0 是一个参数表达式
Math.max(x,y,z) //Math.max 是一个函数；x,y 和 z 是参数
a.sort() //a.sort 是一个函数，它没有参数
return语句给出一个返回值，那么这个返回值就是整个调用表达式的值。否则，调用表达式的值就是undefined。方法调用。在方法调用中，执行函数体的时候，作为属性访问主体的对象和数组便是其调用方法内 this 的指向。这部分 this 的描述很模糊，不过后面会有详细的介绍
对象创建表达式(object creation expression)创建一个对象并调用构造函数来初始化对象的属性。对象创建表达式和函数调用表达式非常类似，只是对象创建表达式之前多了一个关键字 new:
new Object()
new Point(2,3)
如果对象创建表达式不需要传入任何参数给构造函数的话，那么这对圆括号是可以省略掉的
new Object
new Point
toString()方法执行转换，其他对象如果valueOf()方法返回一个原始值的话，则通过valueOf()方法执行转换。
由于多数对象都不具备可用的valueOf()方法，因此他们会通过toString()方法来执行抓换总结归纳：
- 如果是日期那么就使用
toString()
valueOf()能否返回一个原始值valueOf()不可用，那么就使用toString()NaN1 + 2 //=>3 加法
"1" + "2" //=>"12" 字符串连接
"1" + 2 //=>"12"数字转换为字符串后进行字符串连接
1 + {} //=>"1[object object]":对象转换为字符串后进行字符串连接
true + true //=>2 布尔值转换为数字后做加法
2 + null //=>2 null 转换为 0 后做加法
2 + undefined //=>NaN undefined 转换为 NaN 做加法
因此，加法符号类型混用时需要注意其优先级：
1 + 2 + "bmice" //=> "3 bmice"
1 + (2 + "bmice") => "12bmice"
先来看段代码
var a=1;
a++;//输出 2
var a="1";
a++;//输出 2，首先将 1 转换为数字然后自增
var a="abc";
a++;//输出 Nan，因为 abc 无法转换为数字
"a"+1; //输出 a1
"a"++; //Uncaught ReferenceError: Invalid left-hand side expression in postfix operation，因为左操作数无法转换为数字
==运算符用于检测两个操作数是否相等，这里的比较很宽松因为允许了类型转换，检测室会通过如下逻辑：1. 如果一个值是null另一个是undefined，则相等
true则转换成 1，false转换成 0===的检测就比较严格，会通过如下逻辑：1. 如果两个值类型不同，则不相等
null/undefined，则不相等true或者都是布尔值false，则相等NaN或者都是NaN，则不相等（NaN与任何值都不相等）包含各种>,<,>=,<=等比较运算符的运算逻辑：1. 如果操作数为对象，转换成原始值
NaN那么一定返回falsetypeof 也是一个运算符！
delete: 没想到吧, 我也是运算符~
删除属性或者删除数组元素不仅仅是设置一个undefined的值，实际这个属性将不再存在。
读取一个不存在的属性将返回undefined
用户 var 语句声明的变量不能删除
通过 function 语句定义的函数和函数参数也不能被删除
var o={x:1,y:2};
delete o.x;//true
typeof o.x;//undefined
delete o.x;//true
delete o;//false, var 定义的变量无法删除
delete 1;//……闹哪样？this.x=1;//重新赋值，注意没有 var
delete x;//非严格模式下返回 true
//严格模式下会抛出异常，应该用 delete this.x 代替
x;//运行错误
除了原始类型的字符串、数字、布尔值、null、undefined之外，其他值都是对象。
对象是可变的，可以理解成除上述之外的值都是对对象的引用
var x = Obj();
var y = x;
x===y // true
getter或者setter函数属性特性（property attribute）for/in循环该属性使用圆点.或者方括号[]进行属性访问
括号内的表达式必须返回一个转换成字符串的值使用delete关键字就可以删除属性，无论删除的属性是否存在，只要删除成功就会返回true
delete book.author;
delete book["author name"];
false的属性无法删除delete只能删除自有属性，无法删除继承属性。（如果要删除继承属性只能从原型处进行操作）可以通过 4 种方法进行属性检测：1. in运算符
```
var o = {x:1};
"x" in o;//true
"y" in o;//false
"toString" in o;//true
```
2. hasOwnPreperty()
3. PropertyIsEnumerable()
对象有对应属性并且可枚举性为`true`才返回`true`
>内置属性是不能枚举的
4. 通过!==判断属性是否为undefined
```
o.x!==undefined//true
o.y!==undefined//false
```
原型（prototype）指向另一个对象，本对象的属性都继承于原型对象类（class）是一个表示对象类型的字符串创建对象有 3 种方法：1. 对象直接量
2. 关键字new
3. Object.create()
toString()的结果可以使用负数或者非整数作为索引，这种情况下数值会转换为字符串，所以数组不过是一个特殊定制化的对象
一般数据从 0 开始索引，如果值不连续则称为稀疏数组
稀疏数组可以很明显地看出内存利用率高而查找比稠密数组要慢的特性
对于稀疏数组查找元素的时间和常规对象相同
稀疏数组的对于不同浏览器有不同的实现
使用new 关键字的时候就调用了构造函数
以下两种方法是等价的：
var o =new Obj();
var o =new Obj;
构造函数里面会使用this关键字来实现对新创建的对象的引用
var a = new o.m(); //这时候上下文就不是 o 了
[待补充]
undefined（不是null！）
因此对未赋值的形参进行判断的时候最好使用===
有一种很好的用法
a = a || defaultValue;
a赋予一个默认值函数中可以通过arguments来获取所有参数列表，这是一个实参对象（长得很像数组而已），因此可以通过length属性获取传入的参数个数
不会有人傻到定义一个变量叫做
arguments吧
有三种方法用于检测对象类：
缺点：
function typeAndValue(x) {
if (x == null) return "";
switch (x.constructor) {
case Number:return "Number:" + x;
case String:return "String: '" + x + "'";
case Date:return "Date: " + x;
case RegExp:return "Regexp: " + x;
case Complex:return "Complex: " + x;
}
}
缺点：
注意case后面的表达式都是函数。如果使用typeof的话获取到的结果会是字符串，例如下文
function type(o) {
var t, c, n; // type, class, name
// Special case for the null value:
if (o === null) return "null";
// Another special case: NaN is the only value not equal to itself:
if (o !== o) return "nan";
// Use typeof for any value other than "object".
// This identifies any primitive value and also functions.
if ((t = typeof o) !== "object") return t;
// Return the class of the object unless it is "Object".
// This will identify most native objects.
if ((c = classof(o)) !== "Object") return c;
// Return the object's constructor name, if it has one
if (o.constructor && typeof o.constructor === "function" && (n = o.constructor.getName())) return n;
// We can't determine a more specific type, so return "Object"
return "Object";
}
// Return the class of an object.
function classof(o) {
return Object.prototype.toString.call(o).slice(8, -1);
};
// Return the name of a function (may be "") or null for nonfunctions
Function.prototype.getName = function () {
if ("name" in this) return this.name;
return this.name = this.toString().match(/function\s*([^(]*)\(/)[1];
};
此外并非所有对象都有Constructor属性，匿名函数就是个典型：
// This constructor has no name
var Complex = function (x, y) {
this.r = x;
this.i = y;
}
// This constructor does have a name
var Range = function Range(f, t) {
this.from = f;
this.to = t;
}
一个全面并且典型的纯 OOP 例子：
function Set() { // This is the constructor
this.values = {}; // The properties of this object hold the set
this.n = 0; // How many values are in the set
this.add.apply(this, arguments); // All arguments are values to add
}
// Add each of the arguments to the set.
Set.prototype.add = function () {
for (var i = 0; i < arguments.length; i++) { // For each argument
var val = arguments[i]; // The value to add to the set
var str = Set._v2s(val); // Transform it to a string
if (!this.values.hasOwnProperty(str)) { // If not already in the set
this.values[str] = val; // Map string to value
this.n++; // Increase set size
}
}
return this; // Support chained method calls
};
// Remove each of the arguments from the set.
Set.prototype.remove = function () {
for (var i = 0; i < arguments.length; i++) { // For each argument
var str = Set._v2s(arguments[i]); // Map to a string
if (this.values.hasOwnProperty(str)) { // If it is in the set
delete this.values[str]; // Delete it
this.n--; // Decrease set size
}
}
return this; // For method chaining
};
// Return true if the set contains value; false otherwise.
Set.prototype.contains = function (value) {
return this.values.hasOwnProperty(Set._v2s(value));
};
// Return the size of the set.
Set.prototype.size = function () {
return this.n;
};
// Call function f on the specified context for each element of the set.
Set.prototype.foreach = function (f, context) {
for (var s in this.values) // For each string in the set
if (this.values.hasOwnProperty(s)) // Ignore inherited properties
f.call(context, this.values[s]); // Call f on the value
};
Set._v2s = function (val) { //这是一个内部函数，当然实例对象无法调用这个方法
switch (val) {
case undefined:
return 'u'; // Special primitive
case null:
return 'n'; // values get single-letter
case true:
return 't'; // codes.
case false:
return 'f';
default:
switch (typeof val) {
case 'number':
return '#' + val; // Numbers get # prefix.
case 'string':
return '"' + val; // Strings get " prefix.
default:
return '@' + objectId(val); // Objs and funcs get @
}
}
// For any object, return a string. This function will return a different
// string for different objects, and will always return the same string
// if called multiple times for the same object. To do this it creates a
// property on o. In ES5 the property would be nonenumerable and read-only.
function objectId(o) {
var prop = "|**objectid**|"; // Private property name for storing ids
if (!o.hasOwnProperty(prop)) // If the object has no id
o[prop] = Set._v2s.next++; // Assign it the next available
return o[prop]; // Return the id
}
};
Set._v2s.next = 100; // Start assigning object ids at this value.
另一种通过返回值设定类的方法
function Test() {
var map = 1;
function a(){
map = 2;
}
function b(){
console.log(map);
}
return{
a:a,
b:b
}
}
var t = new Test()
对于后者：
原书中的子类内容比较累赘，可以归纳为以下几步：1. 继承 prototype 中定义的属性和方法；1. 继承构造函数中定义的属性和方法；1. 修改子类的 prototype 对象的 constructor 指针
```
function Animal(name) {
this.name = name;
}
Animal.prototype.set = "female";
Animal.prototype.info = function () {
console.log("animal");
}
function People(name) {
this.name = name;
}
People.prototype = new Animal("animal"); // 继承父类中定义的属性和方法；People.prototype.info = function() { //重写父类中定义的属性和方法；console.log("peopel")
};
//Demo
var cat = new Animal('cat');
console.log(cat instanceof Animal); //t
console.log(cat instanceof Object); //t
console.log( typeof Animal.prototype); //object
console.log( typeof Animal.constructor); //function
console.log(Animal.prototype.constructor == Animal); //true
var mike = new People("mike");
console.log(mike.sex);//female
mike.info();//People
console.log(mike instanceof People); //t
console.log(mike instanceof Animal); //t
console.log(mike instanceof Object); //t
console.log( typeof Animal.prototype); //object
console.log( typeof Animal.constructor); //function
console.log(People.prototype.constructor == People); //true
```
简单封装方法：1. 使用var关键字设置私有属性
2. 阻止类的扩展：
使用`Object.seal()`可以`阻止给对象添加属性并将已有的属性设置为不可配置的，即不可删除`
但是这种情况下依然可以修改属性
```
Object.seal(mike);
mike.sex = 'male'; //仍然可以修改
delete mike.sex; //Cannot delete property 'sex'
```
3. 阻止类的修改：
和`Object.seal()`类似不过`Object.freeze`方法将实例方法设置为不可写的
这种情况下修改对应方法将变得无效
```
Object.seal(mike);
mike.sex = 'male'; //不会报错但是修改无效
```
首先我们来看看 Module 模式的基本特征：1. 模块化，可重用 2. 封装了变量和 function，和全局的 namaspace 不接触，松耦合 3. 只暴露可用 public 的方法，其它私有方法全部隐藏
var Calculator = function (eq) {
//这里可以声明私有成员
var eqCtl = document.getElementById(eq);
return {
// 暴露公开的成员
add: function (x, y) {
var val = x + y;
eqCtl.innerHTML = val;
}
};
};
var calculator = new Calculator('eq');
calculator.add(2, 2);
(function () {
// …… 所有的变量和 function 都在这里声明，并且作用域也只能在这个匿名闭包里
// ……但是这里的代码依然可以访问外部全局的对象
}());
注意，匿名函数后面的括号，这是 JavaScript 语言所要求的，因为如果你不声明的话，JavaScript 解释器默认是声明一个 function 函数，有括号，就是创建一个函数表达式，也就是自执行，用的时候不用和上面那样在 new 了，当然你也可以这样来声明：
(function () {/* 内部代码 */})();
获取全局变量到匿名函数域
(function ($, YAHOO) {
// 这儿$相当于全局的 jQuery
} (jQuery, YAHOO));//这两个是全局变量, 我们把它们放到这儿说明使用这两个参数调用上面那个匿名函数
从匿名函数域设定全局变量
var blogModule = (function () {
var my = [1,2,3]
return my;//其实只要把这些变量返回回去就行了, 之后 blogModule 就相当于 my 这个变量
} ());
当然 return 也可以返回一个 object
var blogModule = (function () {
var my = [1,2,3]
return {
my: my,
you: null
}
} ());
var blogModule = (function (my) { // 2. 这里接收到了传进来的 blogModule 并把 blogModule 命名为 my
var AddPhoto = function () { // 3. 这里给 my 添加了个函数, 因此 blogModule 也多了个函数
console.log(123);
};
return {AddPhoto: AddPhoto};
} (blogModule)); //1. 这里将 blogModule 传了进去
blogModule.AddPhoto()// 4. 扩展完毕后就可以调用了
上面的扩展必须要先定义这个blogModule, 能否在未定义的时候初始化而在已定义的时候直接扩展来达到松耦合的目的呢:
var blogModule = (function (my) {
// 添加一些功能
return my;
} (blogModule || {}));
这样可以英一顺序加载 module 模式
虽然松耦合扩展很牛叉了，但是可能也会存在一些限制，比如你没办法重写你的一些属性或者函数，也不能在初始化的时候就是用 Module 的属性。紧耦合扩展限制了加载顺序，但是提供了我们重载的机会，看如下例子：
var blogModule = (function (my) {
var oldAddPhotoMethod = my.AddPhoto;
my.AddPhoto = function () {
// 重载方法，依然可通过 oldAddPhotoMethod 调用旧的方法
};
return my;
} (blogModule));
blogModule.CommentSubModule = (function () {
var my = {};
// ……
return my;
} ());
