第二节：函数和对象

标签：声明式函数和赋值式函数   function对象   变量作用域   函数和对象的关系   工厂方法、构造函数法、原型链   对象方法和静态方法   

一、函数

JavaScript中的函数定义分为两种：声明式函数和赋值式函数。而且，函数的名称就是函数的内存地址，和变量一样，指向函数代码所在的内存区域。

// 声明式函数

function fn(name){

    var msg = "你好，"+name+"，我是一个函数.";

    alert(msg);

}

// 赋值式函数

var fn = function(name){

    var msg = "你好，"+name+"，我是一个函数.";

    alert(msg);

}

以上两种表达式中的fn是一样的，都是指向一个函数的指针。alert(fn)的运行结果都是：

alert(fn)之所以能够打印函数的声明语句，是因为toString()方法：

function fn(){

    var msg = "你好，"+name+"，我是一个函数.";

    alert(msg);

}

alert(fn.toString());

运行结果是一样的。

那么toString()方法是怎样来的呢？

对于JavaScript来说，函数其实是Function类的对象。比如，我们可以用Function类直接创建上面的fn函数：

var fn = new Function("name","var msg = \"你好，\"+name+\"，我是一个函数.\";\nalert(msg);");

alert(fn);

执行结果如下：

函数的执行结果也是一样的：

var fn = new Function("name","var msg = \"你好，\"+name+\"，我是一个函数.\";\nalert(msg);");

fn("张三");

Function对象有length属性，可以查看函数的参数，有valueOf()方法和toString()方法，这两个方法返回的都是函数的源代码。因此，alert(fn)显示的就是函数的声明语句了。

既然函数名是指向函数的变量，那么就可以把函数作为参数传递给另一个函数。

function fn(name){

    var msg = "你好，"+name+"，我是一个函数.";

    alert(msg);

}

function call_fn(func,name){

    func(name);

}

call_fn(fn,"张三");

JavaScript的函数，使用特殊对象arguments封装了函数的参数，我们无需明确指出参数名，就能访问它们。通过属性 arguments.length可以获得函数的参数个数 。用arguments对象判断传递给函数的参数个数，即可模拟函数重载。下面是官方的一个例子。

function doAdd() {

  if(arguments.length == 1) {

    alert(arguments[0] + 5);

  } else if(arguments.length == 2) {

    alert(arguments[0] + arguments[1]);

  }

}

doAdd(10);       //输出 "15"

doAdd(40, 20);    //输出 "60"

JavaScript函数中，变量的作用域，要特别注意的一点是：加var关键字的变量是函数内部的局部变量，函数执行完后，变量将销毁；但没有加var关键字的变量，将成为全局变量，函数外可以访问。

function fn(){

    var x = 10;

    y = 20;

    alert("函数内部访问x:"+x+"\n函数内部访问y:"+y);

}

fn();

alert("函数外部访问y:"+y);

alert("函数外部访问x:"+x);

二、对象

JavaScript没有类的概念，只有对象定义。对象是由 new 运算符加上要实例化的对象的名字创建的。其中，要实例化的对象其实就是函数。那么，函数是怎样变成对象的呢？

先看下面这段代码。

function myobj(){

  return this;

}

var f = myobj();

var o= new myobj();

alert(f);

alert(o);

我们发现，加了new运算符后，this才指向由myobj创建的对象。

而var f = myobj()，这就不是创建对象，其中的this不是指myobj创建的对象，而是代码当前上下文环境的当前对象，比如是window。

也就是说，用new运算符调用函数就创建了对象。this代表实例化之后的对象，可以显示的return，但并不需要这么做。以下代码效果是一样的。

function myobj(){

}

var o = new myobj();

alert(o);

JavaScript的Object对象与Java中的Object相似，JavaScript中的所有对象都由这个对象继承而来，Object对象中的所有属性和方法都会出现在其他对象中。

Object 对象具有下列属性：

1. constructor：创建对象的函数（构造函数）的引用（指针）。

2. Prototype：对该对象的对象原型的引用。对于所有的对象，它默认返回Object对象的一个实例。

   
   

还具有几个方法：

1. hasOwnProperty(property) ：判断对象是否有某个特定的属性。必须用字符串指定该属性。（例如，o.hasOwnProperty("name")）。

2. isPrototypeOf(object) ：判断该对象是否为另一个对象的原型。

3. propertyIsEnumerable ：判断给定的属性是否可以用 for...in 语句进行枚举。

4. toString() ：返回对象的原始字符串表示。对于 Object 对象，ECMA-262 没有定义这个值，所以不同的 ECMAScript 实现具有不同的值。

5. valueOf() ：返回最适合该对象的原始值。对于许多对象，该方法返回的值都与 ToString() 的返回值相同。

6. 
   

我们在浏览器的开发者工具的控制台输入new object()回车，可以查看上面那些Object对象的属性和方法。

Object对象也可以使用对象字面量语法来创建：var o = {};

同样，我们可以在浏览器的开发者工具中进行验证。

javascript支持后绑定，比如这样:

function obj()

{

}

var o = new obj();

o.fn = function(){

  alert("hello");

}

o.fn();

所以，可以通过函数创建对象，这叫工厂方法：

function createCar(color,doors,mpg) {

  var car = new Object();

  car.color = color;

  car.doors = doors;

  car.mpg = mpg;

  car.showColor = function() {

    alert(this.color);

  };

  return car;

}

var car1 = createCar("red",4,23);

var car2 = createCar("blue",3,25);

car1.showColor();

car2.showColor();

比较正规一点的创建对象的方法，用构造函数法，用this代表当前对象了：

function Car(color,doors,mpg) {

  this.color = color;

  this.doors = doors;

  this.mpg = mpg;

  this.showColor = function() {

    alert(this.color);

  };

}

var car1 = new Car("red",4,23);

var car2 = new Car("blue",3,25);

car1.showColor();

car2.showColor();

构造函数法的问题是，其中的对象方法，比如例子中的showColor方法，每次new的时候都会创建一次，显然浪费内存。

可以用原型链定义对象的方法。这样，所有对象共享一个对象方法，既保证了对象属性的唯一性，也节约了内存：

function Car(color,doors,mpg) {

    this.color = color;

    this.doors = doors;

    this.mpg = mpg;

    this.drivers = new Array("Mike","John");

}

Car.prototype.showDrivers = function() {

  alert(this.drivers);

};

var car1 = new Car("red",4,23);

var car2 = new Car("blue",3,25);

car1.drivers.push("Bill");

car1.showDrivers();        //输出 "Mike,John,Bill"

car2.showDrivers();        //输出 "Mike,John"

对象方法，只能是new之后的对象可以访问：

function obj(){

}

obj.prototype.fn = function(){

    alert("hello");

}

var o = new obj();

o.fn();

但是，如果这样访问obj.fn()就会报错：

function obj(){

}

obj.prototype.fn = function(){

    alert("hello");

}

obj.fn();

用函数名字直接访问的方法，我们叫函数方法，或者静态方法。

function obj(){

}

obj.fn = function(){

    alert("hello");

}

obj.fn();

但javascript的静态方法，对象并不能访问，如果这样就会报错：

function obj(){

}

obj.fn = function(){

    alert("hello");

}

var o = new obj();

o.fn();

还有很重要的一点，原型属性是所有对象共享，如果属性是引用类型，那么就会出现，一个对象修改了数值，其他对象相应的属性数值都会改变的尴尬局面。

function obj(){

}

obj.prototype.names = ["张三","李四"];

var o1 = new obj();

var o2 = new obj();

o1.names.push("o1添加的新的名字");

alert("o1.names:"+o1.names+"\no2.names:"+o2.names);

其实，javascript并没有真正的静态方法，只是利用javascript灵活的特性模拟实现的。

本文出自 “老惠” 博客，转载请与作者联系！

第二节：函数和对象

标签：声明式函数和赋值式函数   function对象   变量作用域   函数和对象的关系   工厂方法、构造函数法、原型链   对象方法和静态方法   

原文地址：http://19680411.blog.51cto.com/11767410/1952283