javascript中的Function对象

名词解释:
        constructor    保存了对创建该对象的"类"的引用
        prototype    保存了该类"父"类型的实例对象的引用(模板),在JS中属于Function的属性

        prototype模式   通过对模板类实例进行复制,来产生新的对象,有点象工厂


javascript中的Function对象

        js中的function 并不同于我们在C等语言中的执行过程,在js中,他实际上是一个"类",这个类起到了支撑的作用,下面一起来看看这个类

       1.js 对象模式
          JS通过prototype来进行类的继承(实际上是扩展),prototype是一种设计模式, (参见《设计模式》),prototype
 需要一个类作为模板,在JS中这个类就是object, 熟悉原形模式的人可以能已经知道 var o = new Object(); 这段代码实际做了什么,事实上他并不是我们在C中的malloc或者c ++ 中的new, 这里实际上通知Object()这个方法(Object()实际上不是我们在JAVA中理解的那样, 下面会讲到),以object的实例对象为模板,并加入新的属性(在Object()中定义的) 来产生一个对象并返回,所有的对象都是这样产生的

       2.Function 的角色
          那么Function充当什么角色呢, 看下面的代码......

 
var f = new Function("this.bb = 1");
    
var b = new f();
    alert(b.bb); 
1

    alert(
typeof b); object //b是一个object类的对象
    alert(b.constructor); //function f(){var aa = 1; }
    alert(b.prototype); //undefined 就象前面所说的,new 操作符返回一个object类的实例,因为object被作为模板,所以它本身没有模板,那么它的prototype值也就未定义了

    alert(
typeof f); //function f是一个function类的对象
    alert(f.constructor); //function Function(){[native code]}
    alert(f.prototype); //[object Object] //注意这里,f是Function的一个实例,他的原形为object。到这里,您可能还没有想明白是怎么回事,难道Function继承自Object吗??呵呵..看下面

 alert(
typeof Function);//function Function是JS内置的对象
 alert(Function.constructor);// function Function(){[native code]}
 alert(Function.prototype); //function prototype(){[native code]}  注意这里,很关键,它就是实例化object的地方
 alert(Function.prototype.constructor); //function Function(){[native code]}
alert(Function.prototype.prototype); //undefined //按道理所有的function xxx都应该继承自Function,也就是说,这里应该是object,但这里为未定义,表明Function实际上是一个根包装类,prototype()的返回值就是object的实例

为什么说Function是根包装类,看下面的代码.....
var o = new Object();
    alert(
typeof o); //object
    alert(o.constructor); //function Object(){[native code]} o是由Object这个类来产生的
    alert(o.prototype); //undefined 

    alert(
typeof Object);// function
    alert(Object.constructor); //function Function(){[native code]} Object 是由Function产生的
    alert(Object.prototype); //[object Object]
现在明白了吧。。。
在js 中把 function xx(){} 称为构造函数的原因就是因为,不管你继承了多少, 你的constructor最终会指向Function 调用本地方法产生一个object,不管方式如何,总之产生了一个对象,所以叫构造也很贴切
 

以上是我在实际使用中发现的,没有参考过nn资料,不对的欢迎指正
andyyukun@hotmail.com

### JavaScript 中 `function` 的用法与相关概念 在 JavaScript 中,`function` 是一种非常重要的构造,它既可以作为普通的逻辑代码容器(类似于其他语言中的函数),也可以作为对象使用。以下是关于 `function` 的定义、用法及示例的详细介绍。 #### 1. `function` 作为普通函数 `function` 可以像传统编程语言中的函数一样被定义和调用。其基本定义方式如下: ```javascript function functionName([argument1] [, argument2] [..., argumentN]) { [statements] } ``` 具体有以下几种写法: - **定义式**:直接通过 `function` 关键字定义。 ```javascript function add(x, y) { return x + y; } console.log(add(2, 3)); // 输出 5 [^1] ``` - **表达式式**:将匿名函数赋值给变量。 ```javascript var multiply = function(x, y) { return x * y; }; console.log(multiply(2, 3)); // 输出 6 [^3] ``` - **命名表达式**:为函数表达式赋予一个内部名称。 ```javascript var factorial = function fact(n) { return n <= 1 ? 1 : n * fact(n - 1); }; console.log(factorial(5)); // 输出 120 [^3] ``` #### 2. `function` 作为对象JavaScript 中,每个函数实际上都是一个对象,因此可以将其视为一种特殊的对象类型。这种特性使得函数可以拥有属性和方法,并且可以通过多种方式操作。 - **动态创建函数**:通过 `Function` 构造函数动态生成函数。 ```javascript var dynamicFunc = new Function('x', 'y', 'return x + y;'); console.log(dynamicFunc(3, 4)); // 输出 7 [^4] ``` - **函数的属性和方法**: - `prototype`:每个函数都有一个 `prototype` 属性,用于支持原型继承。 ```javascript function Person(name) { this.name = name; } Person.prototype.greet = function() { console.log(`Hello, my name is ${this.name}.`); }; var john = new Person('John'); john.greet(); // 输出 "Hello, my name is John." [^2] ``` - `apply` 和 `call`:用于显式指定函数调用时的 `this` 值。 ```javascript var obj = { value: 42 }; function getValue() { return this.value; } console.log(getValue.call(obj)); // 输出 42 [^2] console.log(getValue.apply(obj)); // 输出 42 [^2] ``` #### 3. 特殊的 `this` 关键字 `this` 的值取决于函数的调用方式,而不是定义方式。以下是几种常见的场景: - 在全局上下文中,`this` 指向全局对象(浏览器中为 `window`)。 - 在对象方法中,`this` 指向调用该方法的对象。 - 使用 `call` 或 `apply` 时,`this` 被显式指定。 - 在箭头函数中,`this` 继承自定义它的作用域。 ```javascript var globalValue = 'global'; var obj = { value: 'local', getValue: function() { return this.value; } }; console.log(obj.getValue()); // 输出 'local' [^1] function testThis() { console.log(this.globalValue); } testThis(); // 输出 'global' [^1] ``` ### 示例代码总结 ```javascript // 定义式 function greet(name) { return `Hello, ${name}!`; } console.log(greet('Alice')); // 输出 "Hello, Alice!" // 表达式式 var subtract = function(a, b) { return a - b; }; console.log(subtract(10, 5)); // 输出 5 // 动态创建函数 var power = new Function('base', 'exponent', 'return Math.pow(base, exponent);'); console.log(power(2, 3)); // 输出 8 // 使用 prototype function Animal(type) { this.type = type; } Animal.prototype.describe = function() { return `This is a ${this.type}.`; }; var dog = new Animal('dog'); console.log(dog.describe()); // 输出 "This is a dog." ```
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值