JavaScript中Function函数与Object对象的关系

时间:2023-01-24 21:09:13

函数对象和其他内部对象的关系

  除了函数对象,还有很多内部对象,比如:Object、Array、Date、RegExp、Math、Error。这些名称实际上表示一个 类型,可以通过new操作符返回一个对象。然而函数对象和其他对象不同,当用typeof得到一个函数对象的类型时,它仍然会返回字符串 “function”,而typeof一个数组对象或其他的对象时,它会返回字符串“object”。下面的代码示例了typeof不同类型的情况:

以下是引用片段: 
alert(typeof(Function))); 
alert(typeof(new Function())); 
alert(typeof(Array)); 
alert(typeof(Object)); 
alert(typeof(new Array())); 
alert(typeof(new Date())); 
alert(typeof(new Object()));

  运行这段代码可以发现:前面4条语句都会显示“function”,而后面3条语句则显示“object”,可见new一个function 实际上是返回一个函数。这与其他的对象有很大的不同。其他的类型Array、Object等都会通过new操作符返回一个普通对象。尽管函数本身也是一个 对象,但它与普通的对象还是有区别的,因为它同时也是对象构造器,也就是说,可以new一个函数来返回一个对象,这在前面已经介绍。所有typeof返回 “function”的对象都是函数对象。也称这样的对象为构造器(constructor),因而,所有的构造器都是对象,但不是所有的对象都是构造 器。

  既然函数本身也是一个对象,它们的类型是function,联想到C++、Java等面向对象语言的类定义,可以猜测到Function类型 的作用所在,那就是可以给函数对象本身定义一些方法和属性,借助于函数的prototype对象,可以很方便地修改和扩充Function类型的定义,例 如下面扩展了函数类型Function,为其增加了method1方法,作用是弹出对话框显示"function":

以下是引用片段: 
Function.prototype.method1=function(){ 
      alert("function"); 

function func1(a,b,c){ 
      return a+b+c; 

func1.method1(); 
func1.method1.method1();

  注意最后一个语句:func1.method1.mehotd1(),它调用了method1这个函数对象的method1方法。虽然看上去 有点容易混淆,但仔细观察一下语法还是很明确的:这是一个递归的定义。因为method1本身也是一个函数,所以它同样具有函数对象的属性和方法,所有对 Function类型的方法扩充都具有这样的递归性质。

  Function是所有函数对象的基础,而Object则是所有对象(包括函数对象)的基础。在JavaScript中,任何一个对象都是 Object的实例,因此,可以修改Object这个类型来让所有的对象具有一些通用的属性和方法,修改Object类型是通过prototype来完成 的:

以下是引用片段: 
Object.prototype.getType=function(){ 
       return typeof(this); 

var array1=new Array(); 
function func1(a,b){ 
      return a+b; 

alert(array1.getType()); 
alert(func1.getType());

  上面的代码为所有的对象添加了getType方法,作用是返回该对象的类型。两条alert语句分别会显示“object”和“function”。

将函数作为参数传递

  在前面已经介绍了函数对象本质,每个函数都被表示为一个特殊的对象,可以方便的将其赋值给一个变量,再通过这个变量名进行函数调用。作为一个 变量,它可以以参数的形式传递给另一个函数,这在前面介绍JavaScript事件处理机制中已经看到过这样的用法,例如下面的程序将func1作为参数 传递给func2:

以下是引用片段: 
function func1(theFunc){ 
      theFunc(); 

function func2(){ 
      alert("ok"); 

func1(func2);

  在最后一条语句中,func2作为一个对象传递给了func1的形参theFunc,再由func1内部进行theFunc的调用。事实上,将函数作为参数传递,或者是将函数赋值给其他变量是所有事件机制的基础。

例如,如果需要在页面载入时进行一些初始化工作,可以先定义一个init的初始化函数,再通过window.onload=init;语句将其绑定到页面载入完成的事件。这里的init就是一个函数对象,它可以加入window的onload事件列表。

 
————————————————————————————————————————————————————————————————————————————
 

Function是javascript里最常用的一个概念,javascript里的function是最容易入手的一个功能,但它也是javascript最难理解最难掌握的一个概念。

今天我们来尝试理解Function和Object.因为这个里面有些人前期可能会搞糊涂.他们之间到底是什么关系.当然也不除外当初的我.

注意:官方定义: 在Javascript中,每一个函数实际上都是一个函数对象.

我们先来看最简单的两个代码,也是最容易理解的.

1
2
3
4
5
6
function fn(){}
var obj = {}
console.log(fn instanceof Function)//true
console.log(obj instanceof Object)//true
console.log(fn instanceof Object)//true
console.log(obj instanceof Function)//false

前面两个打印的效果,大家都容易理解.后面 fn instanceof Object 是为true.这里也是一样,从函数的定义来说: 在javascript中一切函数实际都是函数对象. 所以为true就不奇怪了.obj instanceof Function 为false,当然不奇怪了.因为他是一个对象,不是函数.

我们再来看一个代码

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

代码很简单.运行结构两个都是为true,为什么呢? 第一个用函数的定义来说,(javascript中函数实际也是一个函数对象),当然为true,那第二个呢?对象也是函数?

Object也是函数.因为Object的结构是function Object(){native code}.

这种形式,很清晰的就是声明的一个Object函数,当然就是函数了,所以两个都是为true.

他们两个Function和Object函数实现代码,那当然是不一样了.他们是怎么实现的,那我们就不去详细琢磨了,如果想琢磨的,就可以了解浏览器的相关知识了.

JavaScript中Function函数与Object对象的关系的更多相关文章

  1. Javascript中的"函数是第一类对象(first-class object)"

    本身这句话很好解释,函数有两个主要特点,援引自 陈新 译的<JavaScript模式>: 1.函数是第一类对象: 函数可以在运行时动态创建,还可以在程序执行过程中创建. 函数可以分配变量, ...

  2. javascript中function 函数递归的陷阱问题

    //看下这个递归方法,最后输出的值function fn(i){ i++; if(i<10){ fn(i); } else{ return i; } } var result = fn(0); ...

  3. JavaScript中的函数(一)

    javaScript中的函数实际上是对象,每一个函数都是Function类型的实例,和其他引用类型一样具有属性和方法.由于函数是对象,因此函数名实际上也就是一个指向函数对象的指针,也就是函数对象的一个 ...

  4. Javascript中的函数&lpar;Function&rpar;与对象&lpar;Object&rpar;的关系

    今天我们来尝试理解Function和Object.因为这个里面有些人前期可能会搞糊涂.他们之间到底是什么关系.当然也不除外当初的我. 注意:官方定义: 在Javascript中,每一个函数实际上都是一 ...

  5. Javascript中Function&comma;Object&comma;Prototypes&comma;&lowbar;&lowbar;proto&lowbar;&lowbar;等概念详解

    http://anykoro.sinaapp.com/2012/01/31/javascript%E4%B8%ADfunctionobjectprototypes__proto__%E7%AD%89% ...

  6. JavaScript中你所不知道的Object(二)--Function篇

    上一篇(JavaScript中你所不知道的Object(一))说到,Object对象有大量的内部属性,而其中多数和外部属性的操作有关.最后留了个悬念,就是Boolean.Date.Number.Str ...

  7. JavaScript正则表达式详解(二)JavaScript中正则表达式函数详解

    二.JavaScript中正则表达式函数详解(exec, test, match, replace, search, split) 1.使用正则表达式的方法去匹配查找字符串 1.1. exec方法详解 ...

  8. JavaScript中的函数表达式

    在JavaScript中,函数是个非常重要的对象,函数通常有三种表现形式:函数声明,函数表达式和函数构造器创建的函数. 本文中主要看看函数表达式及其相关的知识点. 函数表达式 首先,看看函数表达式的表 ...

  9. ES6新特性:Javascript中的Map和WeakMap对象

    Map对象 Map对象是一种有对应 键/值 对的对象, JS的Object也是 键/值 对的对象 : ES6中Map相对于Object对象有几个区别: 1:Object对象有原型, 也就是说他有默认的 ...

随机推荐

  1. 初识SQL 执行顺序

    SQL不同于一般的程序代码,会按照一定的顺序进行执行,他的第一个执行始终从from开始执行,虽然Select出现在第一位置但是执行顺序 确不是在第一个.有时候可能大家写了很久的代码,不一定能够很好的理 ...

  2. c语言编程之二叉排序树

    二叉排序树,又称为二叉查找树.它是一颗空树,或者是具有下面的性质的二叉树: 1.若它的左子树不空,则左子树上所有节点的值均小于它的根结构的值: 2.若它的右子树不空,则右子树上所有节点的值均大于它的根 ...

  3. Swift计算属性

    除存储属性外,类.结构体和枚举可以定义计算属性,计算属性不直接存储值,而是提供一个 getter 来获取值,一个可选的 setter 来间接设置其他属性或变量的值. struct Point { va ...

  4. LVS配置与安装

    IP和主机准备: 准备VIP :20.20.20.1 lvs主机 :172.24.22.70 HA主机:172.24.22.4 包准备:ipvsadm-1.24.tar.gz 1.安装前配置包  2. ...

  5. JAVA GUI学习 - JMenuBar菜单条、JMenu菜单、JMenuItem菜单项组件学习

    public class MenuBarKnow extends JFrame { JMenuBar jMenuBar; JMenu jMenuFile,jMenuEditor,jMenuAbout; ...

  6. CSS小记&lpar;持续更新&period;&period;&period;&period;&period;&period;&rpar;

    1 内联元素和块级元素的区别以及display的三种属性区别 在说起display属性之前,就必须先说说什么是文档流,以及文档流中的内敛元素和块级元素又是指什么? 一直觉得理解了文档流的概念,一堆CS ...

  7. bzoj1061--线性规划

    线性规划裸题... 根据题目很容易可以得到线性规划方程(以样例为例): Min(2*x1+5*x2+2*x3) x1+ 0+ 0>=2 x1+x2+ 0>=3 0+x2+x3>=4 ...

  8. Flink on yarn的配置及执行

    1. 写在前面 Flink被誉为第四代大数据计算引擎组件,即可以用作基于离线分布式计算,也可以应用于实时计算.Flink可以自己搭建集群模式已提供为庞大数据的计算.但在实际应用中.都是计算hdfs上的 ...

  9. Spring 快速开始 Profile 和 Bean

    和maven profile类似,Spring bean definition profile 有两个组件:声明和激活. [栗子:开发测试环境使用HyperSQL 生产环境使用JNDI上下文根据配置查 ...

  10. 20165323 预备作业3 Linux安装及学习

    一.Linux安装 首先我按照老师所给的步骤下载了VirtualBox 5.2.6和Ubuntu 16.04.3.有流程下载很简单,但是在下载的过程中还是出现了一些问题. 1.VirtualBox 只 ...