JavaScript构造函数与 Function 对象之间的推理关系

作者: 鲁智深 分类: JAVASCRIPT 发布时间: 2015-12-07 00:12

首先我们来理解一下“作为值的函数”将一个函数作为另一个函数的结果进行返回,作为结果返回的函数称之为作为值的函数。

作为值的函数

1
2
3
4
5
6
7
8
9
10
11
12
13
//将一个函数作为另一个函数的结果返回
function fun(a) {//声明方式定义函数
    var b  = a;
    return function () {
        return b +1;
    }
}
//分解的写法
var returl = fun(10);
console.log(returl());

//简写的方法
console.log(fun(10)());

代码中看出函数也可以作为值,并且可以像变量一样传递。

下面来理解一下构造函数与对象的区别

函数是这样的一段 JavaScript 代码,它只定义一次,但可能被执行或调用多次。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
//字面量方式创建对象
var obj = {
    name : '艾映锋',
    fun : function () {
        return 1;
    }
}

console.log(typeof obj);//object
console.log(obj instanceof Object);//true

//构造函数创建对象
var obj = new Object();
console.log(obj);//{}空对象

//声明方式创建函数
function fn() {
    return 12;
}

console.log(typeof fn);//Function类型
console.log(fn instanceof Function);//true

//function类型,也可以new一下,(ps:new谁,返回的就是一个对象)
var fn1 = new Function();
console.log(fn1);//Function类型????

问题来了:new出来的对象是Function类型????

代码检验:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
//凡是构造函数都是可以new的,也就是说都可以成为对象
var fn = new Function();
console.log(fn);//Function,是一个函数
console.log(fn());//undefined

//但是不建议这样写
/*var str = new String('dadd');
 var num = new Number('dadd');
 var bool = new Boolean('dadd');*/


//函数中都是包含参数和函数体的
var fn1 = new Function('a,b','return a+b');

console.log(fn1(1,2));//输出3

/*定义函数的方式
//1、声明方式定义
var fun = function (形参) {
    函数体;
}
//2、字面量方式定义
function fun(形参) {
    函数体;
}
//构造函数方式定义
var fun = new Function(形参,函数体);
结论----js中所有的函数都是一个Function对象*/


//那么对象是否是Object类型,来判断一下
console.log(fn1 instanceof Object);//返回true,以上结论正确

所有这里出现了一个概念:凡是构造函数都是可以new的,也就是说都可以成为对象,这里当然要给Function类型的对象取个名字,它就叫“Function对象”。

上面得到的结论是:构造函数都是可以成为对象!

同时JavaScript也给了构造函数规定写法,上代码

构造函数创建对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/*
* 自己创造一个构造函数
* 构造函数后,就可以利用构造函数创建对象
* 在js中有固定语法结构
* 定义属性 - this.属性名 = 值;
* 定义方法 - this.方法名 = function(){}
* 首字母大写,为什么大写,js自己的构造函数首字母大写。
* 再由上面进行推理出来,构造函数就是一个对象
* */

function Fun() {
    this.name = '艾映锋';//定义属性
    this.age = '18';//定义属性
    this.fn = function () {
        return 1999;
    }
}

//通过构造函数,创建对象
var obj = new Fun();
console.log(typeof obj);//object是一个对象类型
console.log(obj instanceof Function);//false,创建对象的构造函数是Function类型,但创建的对象不是Function类型
console.log(Fun instanceof Function);//true

总结,所有的函数都是一个对象,所有的对象,都可以用构造函数创建

思考题:

1
2
3
4
console.log(Object instanceof Object);// true
console.log(Object instanceof Function);// true
console.log(Function instanceof Function);// true
console.log(Function instanceof Object);// true

函数与对象的演示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function fn() {
    var b = 1;//局部变量
     return{   //大括号里的就是对象,return是返回一个对象
        get :function() {
            return 1;
        },
        set:function(a){
            return c = a +b;
        }
    }
}

console.log(fn());//调用函数输出{ get: [Function], set: [Function] }对象
var obj = fn();
console.log(obj.get());//1
console.log(obj.set(2));//3

函数与构造函数的演示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
//函数
function fn() {
    var a = a +1
    return a;
}
//构造函数
function Fn1() {
    this.name = 'mcai';
    this.age = 129;
    this.fun = function () {
        return 12;
    }
}

//函数 + 构造函数
function fn2() {
    var a = a +1;//局部变量
    (function () {//局部自调函数
        return 123;
    })();

    this.name = 'mcai';//属性
    this.age = 129;//属性
    this.fun = function () {//方法
        return 12;
    }
}

//调用函数
console.log(fn2());

//构造函数--创建对象
var obj = new fn2();
console.log(obj.name);

函数、构造函数与对象

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
function fn() {
    var a = a + 1;//局部变量
    (function () {//内部自调函数
        return 1;
    })();

    //对象
    return {
        name: '艾映锋',
        age : 1123,
        fun :function () {
            return b = ++a;
        }
    }

    //构造函数
    this.name1 = 'mcai';
    this.age2 = 123;
    this.fun = function () {
        return c = ++b ;
    }
}

//函数调用
fn();

//构造函数创建对象
var obj = new fn();

//作为对象使用
var  obj1 = fn();
console.log(obj1);

函数的属性和方法

由于每个函数都是一个 Function 对象,Function 类型也提供了一些属性和方法:

函数的属性和方法

函数的属性和方法

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

发表评论

电子邮件地址不会被公开。 必填项已用*标注