JavaScript 中 Function 的本质与原型链详解

JavaScript 中 Function 的本质与原型链详解

在 JavaScript 中，Function 是最具特色但也常令人困惑的概念之一。

接下来我们将通过具体操作来深入理解它。

 
function doit(){
　 ..... 
} 
doit();

函数作为方法的使用

在 JavaScript 中，我们可以将函数直接当作方法来使用。

 
var obj=new Object();
obj.say=function(){
　 ..... 
　　} 
obj.say();

Function 作为对象的特性

从本质上讲，Function 实际上就是一个对象，它是 Function 类型的实例。

 
function result(num1, num2) {
return num1 + num2;
} 

var result = new Function("num1", "num2", "return num1+num2");

上述两种方式的执行效果完全一致。此外，result 函数还可以采用函数表达式的形式进行定义。

 
var result=function(num1,num2){
return num1+num2;
} 

函数声明与表达式的区别及 arguments 对象

这两种写法的唯一区别在于：函数声明会优先执行，而函数表达式仅在代码执行到该行时才执行。另外，每个函数内部都包含一个类似数组的 arguments 对象。

函数支持动态参数传递，示例如下：

 
function result(){
return arguments[0]+arguments[1];
} 
result(1,2);

arguments 对象在动态传递参数方面被频繁使用。

函数的属性与构造函数模拟

既然函数被视为对象，那么它必然具备相应的属性。

 
function person(){
.... 
} 
person.name="xxxx";
person.say=function(){
alert(this.name);
} 
person.say(); //alert("xxxx")

我们还可以将函数视为类，此时函数体相当于构造函数。

 
function Person(nm){
this.name=nm;
this.say=function(){
alert(nm);
alert(this.name);
} 
} 
var p1=new Person("ygm1");
p1.say(); //alert ygm1 ygm1
var p2=new Person("ygm2");
p2.say(); //alert ygm2 ygm2

需要注意的是，这里必须使用 this.name，因为 this 代表当前对象；如果直接 alert(name)，获取的是 window 对象的属性。同时，传入的参数 nm 在方法 say 中可以直接使用，这涉及作用域链的概念：每个 function 体构成一个独立的作用域，子域可以访问父域的属性，反之则不行（虽然通过闭包也可以实现反向访问，此处不再详述）。

原型链机制与属性查找规则

与其他面向对象语言相比，每个类可以拥有静态属性或方法，而 JavaScript 通过原型机制来模拟这一特性，使每个对象都能共享其属性。

 
function Person(num) {
..... 
} 
Person.prototype.name = "ygm";
alert(new Person().name);

在传统的面向对象语言中，静态方法由类直接调用，不能通过实例化本身来访问；而 JavaScript 由于其特殊性，情况恰好相反。

注意这里 alert Person 的 name 属性：如果函数体内未找到 name，则会去原型中查找；如果找到了，则会屏蔽原型中的 name 并直接返回其值。

实际上，每创建一个 function 的同时也会创建一个原型对象，而该原型对象引用自 Object，因此 Object 是所有对象的基类。

我们可以重写原型对象。

Person.prototype=new ParentPerson();

此时，Person 的原型对象指向 ParentPerson 对象，而 ParentPerson 对象又指向自己的原型对象，从而形成了原型链。

以上就是关于 JavaScript 中 Function 相关机制的简要介绍。