日期:2014-05-16  浏览次数:20365 次

图解Javascript(一)

成为超级给力的Javascript程序员的诀窍之一,就是真正理解这门语言的语义。本文将通过使用浅显易懂的图表来说明Javascript的基本元素。

无处不在的引用

Javascript中的变量只是对内存中某个数值的引用。 这些数值即可以是字符串、数字以及布尔这类的基本数据类型,也可以是对象或者函数。

本地变量

在下面的例子中,我们将在顶级作用域内建立4个本地变量并使他们指向基本类型。

?

//让我们在顶级范围内建立一些本地变量  
var name = "Tim Caswell";  
var age = 28;  
var isProgrammer = true;  
var likesJavaScript = true;  
//看一下这两个变量是否引用了相同的内容  
isProgrammer === likesJavaScript; 

?Output

?

=> true

请注意,这两个布尔类型变量指向了内存中同一个数据。这是因为部分基础类型的字面量是一成不变的(原文直译为:“基础类型的的变量基本上是一成不变的“。疑有误),所以VM会将单一实例共享给所有对指定变量的引用者以作优化。

在上面的代码片段中我们看到,如果对两个引用指向同一个内存数据使用===做比较则会返回true。

外框(The outer box)所代表的是最外层的作用域。这些变量都是顶层的本地变量,不要和global或windows对象的属性混淆。

对象以及原型链

对象其实就是对新对象以及原型引用的集合,唯一要注意的是,在访问一个父对象中存在而本地对象中不存的属性时,原型链所起的作用。

?

// Create a parent object  
var tim = {  
  name: "Tim Caswell",  
  age: 28,  
  isProgrammer: true,  
  likesJavaScript: true  
}  
// Create a child object  
//建立子对象(注1:这种建立方式没有用到第二个参数:注2:tim将会替代Object作为新生成对象的jack.__proto__,也就是jack的构造器的原型对象)  
var jack = Object.create(tim);  
//改写本地的一些属性  
jack.name = "Jack Caswell";  
jack.age = 4;  
//通过原型链查看成员  
jack.likesJavaScript;

?Output

?