具名函数的四种调用方式（转）

转自：http://snandy.iteye.com/blog/420000

1、()小括号运算符   平时最常用的就是()运算符来调用/执行一个函数

//无参函数fun1
function fun1() {
    alert('我被调用了');
}
fun1()

//有参函数fun2
function fun2(param) {
    alert(param);
}
fun2('我被调用了')

ECMAScript3后加入给Function加入了call和apply后，就有了下面两种

2、call

//无参函数fun1
function fun1() {
    alert('我被调用了');
}
fun1.call(null);

//有参函数fun2
function fun2(param) {
    alert(param);
}
fun2.call(null,'我被调用了')

3、apply

//无参函数fun1
function fun1() {
    alert('我被调用了');
}
fun1.apply(null);

//有参函数fun2
function fun2(param) {
    alert(param);
}
fun2.apply(null,['我被调用了'])

4、new （不推荐使用这种方式哦 ）

//无参函数fun1
function fun1() {
    alert('我被调用了');
}
new fun1();


//有参函数fun2
function fun2(param) {
    alert(param);
}
new fun2('我被调用了')

ok,从以上调用方式上看四种方式执行结果没有区别。但如果函数有返回值的话，用new方式调用时可能会让你有些失望。

//有返回值的函数fun
function fun() {
    alert('我被调用了');
    return "jack";
}

var c = new fun();
alert(c);//[object Object]，为什么不是"jack"？

改成这样，

//有返回值的函数fun
function fun() {
    alert('我被调用了');
    return {name:'jack'};
}

var c = new fun();
alert(c.name);//jack,又正常返回了

总结如下：

用new方式调用函数时。如果存在返回值，当返回值是javascript的内置类型（基本类型）如字符串(String)，数字(Number)，布尔(Boolean)等时，将不会返回该值；

当返回值是对象，函数，数组等对象类型时，将返回该对象，函数，数组。

当返回值是内置类型（基本类型）时，new fun()到底返回什么呢？

----------------------------------------------------------------------------------------------------------------

以函数中有无this来讨论。没有this时返回一个空的对象{},有this时返回一个非空对象。

定义一个没有this的函数

//返回值是基本类型
function fun() {
    return "jack";
}

var c = new fun();
for (var atr in c) {
    alert(atr);
}
alert(c);//[object Object]

返回值c不是"jack", 从for in执行后没有输出任何属性可以看出 c 是一个空的对象{}。

再看看有this的函数，函数中有this实际上是在写一个类。但由于js的灵活性，造成了许多诡异的写法。

//返回值是基本类型
function fun() {
    this.name = "tom";
    return "jack";
}

var c = new fun();
for (var atr in c) {
    alert(atr);//name
}
alert(c.name);//tom

返回值也不是"jack"，for in输出了name属性，最后一句输出了tom，说明返回值 c 是一个非空对象。这里的return "jack"压根没起作用。

所以当函数返回值是内置类型（基本类型）时，用new方式调用函数将会导致错误的结果 。

那么当函数返回值是一个对象，数组，函数呢？

//不含this，返回值是一个对象
function fun() {
    //组装一个对象
    var obj = {};
    obj.name = 'andy';
    obj.age = 20;
    obj.msg = function(){}

    return obj;
}

var c = new fun();
for (var atr in c) {
    alert(atr);//name,age,msg
}
alert(c.name);//andy

//含this，返回值是一个对象
function fun() {
    this.sex = "man";
    //组装一个对象
    var obj = {};
    obj.name = 'andy';
    obj.age = 20;
    obj.msg = function(){}

    return obj;
}

var c = new fun();
for (var atr in c) {
    alert(atr);//name,age,msg
}
alert(c.name);//andy

 两段的输出结果是一样的，c都含有name,age,msg属性而不含sex属性。说明当返回值是对象类型（对象，数组，函数）时，new不会用this去构造对象，而直接返回组装的对象。

这种方式实际上是工厂方式，在应用中更多的程序员把函数名首字母大写，让它看起来更像一个类。

这里把函数名首字母大写了，让它符合java类命名规范。

/**
 * 定义一个函数Car
 */
function Car(color,doors) {

    var car = {};
    car.color = color;
    car.doors = doors;
    car.msg = function(){
        alert("This is a " + this.color + " car, there are " + this.doors + " doors." );
    }

    return car;
}

 看起来怪怪的，Car明明是一个类啊，怎么也不像之前的函数调用。和文章标题似乎有些不一致了。但我们的确可以用()来调用它。当然也可以用new来调用它。用new方式则让它更像java的创建对象方式。

//方式1
var c1 = Car('red',2);
c1.msg();

//方式2
var c2 = new Car('black',4);
c2.msg();

这种方式在一些js库中也能见到，如mootools.js中的一个很重要的函数Native，返回值是一个函数(类)。mootools core中的Class类就是Native函数返回的。var Class =  new Native({..});当然也可以不用new而直接采用()调用。