上一篇文章中 介绍了function在javascirpt作为一等公民所担任的重要责任,在不同 的上下文中它担任着不同的角色,
在对象内部它可以是函数,同时又能充当名字空间,不仅如此所有的function都是闭包。看起来它的确是了不得,
不过除 此之外,function还能担当构造函数,亦或者说它同时还是一个类的声明。

这篇文章的目的向大家详细介绍function是如何作为构造函数

如何定义一个函数

  • 声明式

函数定义最常用的方式之一。

 //声明函数
function add(x, y) {
return x + y;
} //声明构造函数
function Animal(name, age) {
this.name = name;
this.age = age;
} Animal.prototype.bark = function() {return 'bark'};

其实这两种发式完全一样,没有任何区别,你同样可以为add的prototype属性增加新的函数或者属性。
不过两种方式是基于不同的用途产生的,我们之所以称后者为构造函数,仅仅因为它的命名函数实现

命名: 对于构造函数我们遵循首字母大学的规则以区别普通函数和方法,这和java中对于类的定义是非常相似的。
实现: 构造函数是我们用来生产实例对象的工具,它通长与new关键字连用,如

 var dog = new Animal('pipi', 3);
dog; // Animal {name: "pipi", age: 3}

同时你可能也注意到了Animal中使用到了this关键字,通长情况下this会指向函数的调用对象,
也就是说如果你在浏览器中运行一下代码,你应该得到window对象:

1 function getThis() {return this};
2 getThis(); //window

试想一下,如果你这样使用构造函数:

  var dog = Animal('pipi', 3); 

这段代码会产生什么有趣的结果呢?
恭喜你!你中招了!
你会发现,你的window对象新增加了两个属性, 同时没有任何对象产生:

 window.name === 'pipi'; //true
window.age === 3 //true
dog === undefined; //true

对比使用构造函数的两种方式,其实这都是new在作怪,当我们在像使用java类那样对构造函数new出javascript对象时,
它帮我们完成了一些magic(这也是javascript new关键字被人诟病的地方),我们不妨来一次魔术揭秘:

//魔术
var dog = new Animal('pipi', 3); //揭秘
function newAlternative(constructor, name, age) {
var obj = {};
//修改this,指向新对象obj
constructor.call(obj, name, age);
   //使实例对象继承构造函数
obj.__proto__ = constructor.prototype;
return obj;
}
var dog = newAlternative(Animal, 'pipi', 3);
dog; //Animal {name: "pipi", age: 3, bark: function}

因此,我们需要非常细心的处理函数,如果它就是‘类’那么请根据潜规则,首字母大写它,并且在使用的时候一定要与new连用。

  • 匿名

匿名函数广泛在javascript代码中使用,先看看这段代码:

 //定义处理元素的匿名函数
[1,2].map(function(e) {return e + 2}); //定义匿名构造函数
var Animal = function(name, age) {
this.name = name;
this.age = age;
}
Animal.prototype.bark = function() {return 'bark'}; Animal.name === ''; //true
  • Function

相对与前两种方式,使用Function来定义一个新的function相对少见。如果说构造函数是为生成实例对象而生,
那么Function就是为生成函数而生,它是生成函数的模板,构造函数,‘类’.

 var Animal =
new Function('name', 'age', 'this.name = name; this.age = age;');
Animal.prototype.bark = function() {return 'bark'};

虽然这种方式在实际开发中很少被用到,但是它对我们理解函数的生成过程有帮助作用,对比一下两组代码,
我们不难发现Animal其实就是Function的实例对象,就如同dog是Animal的实例对象一样。

 Animal.__proto__ === Function.prototype //true

 var dog = new Animal('pipi', 3);
dog.__proto__ === Animal.prototype; //true

总结

函数在javascirpt中起着至关重要的作用,构造函数是其中一种特殊的函数,他通过和new关键字搭配使用,
帮助我们完成看起来与普通面向对 象相似的对象构造过程,不过这仅仅是想像而已,我们必须理解其中的奥秘才能是我们不会在编码过程中犯错。
有了对函数的理解,接下来我们变可以将解javascript中的另外一个非常关键的语言特性,继承机制–原型链,敬请期待。

你了解javascript中的function吗?(1)的更多相关文章

  1. JavaScript中的Function(函数)对象详解

    JavaScript中的Function对象是函数,函数的用途分为3类: 作为普通逻辑代码容器: 作为对象方法: 作为构造函数. 1.作为普通逻辑代码容器 function multiply(x, y ...

  2. javascript中的function命名空間與模擬getter、setter

    function的命名空間 在javascript中,function也可以擁有自己的命名空間例如以下這段程式碼: 12345678 function () { return 'I am A';} A ...

  3. javascript中的Function和Object

    写的很好,理解了很多,特此转发记录 转自:http://blog.csdn.net/tom_221x/archive/2010/02/22/5316675.aspx 在JavaScript中所有的对象 ...

  4. 浅谈JavaScript中的Function引用类型

    引言 在JavaScript中最有意思的就是函数了,这一切的根源在于函数实际上是一个对象.每一个函数都是Function类型的实例,而且都和其他引用类型的实例一样具有属性和方法.函数作为一个对象,因此 ...

  5. 深入理解javascript中的Function.prototye.bind

    函数绑定(Function binding)很有可能是你在开始使用JavaScript时最少关注的一点,但是当你意识到你需要一个解决方案来解决如何在另一个函数中保持this上下文的时候,你真正需要的其 ...

  6. javascript中的function

    function / 对象 所有的变量和方法名的:以字母,$ _开头其他随便,尽量使用英文字母命名,见名知意注意点:不允许使用关键字定义变量和方法的名称====函数即方法,方法即函数====百度:ja ...

  7. javascript中的function对象

    function对象都是Function的实例: > Object.getOwnPropertyNames(Function) [ 'length', 'name', 'arguments', ...

  8. JavaScript中的Function(函数)对象

    1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document->html->(head,body) 4. ...

  9. 理解javascript中的Function.prototype.bind

    在初学Javascript时,我们也许不需要担心函数绑定的问题,但是当我们需要在另一个函数中保持上下文对象this时,就会遇到相应的问题了,我见过很多人处理这种问题都是先将this赋值给一个变量(比如 ...

随机推荐

  1. Spring 整体架构

    1. Core Container:核心容器(core.Beans.Context.Expression Language   Core.Beans框架基础构成,提供IOC.依赖注入特性.BeanFa ...

  2. C# 多线程,论多核时代爱恨情仇

    为什么要学习多线程? 2010年1月21日是10年某市公务员考试的报名截止日.因从下午2点开始,用于报名的北京市人事考试网瘫痪,原定于昨天下午5点截止的报名时间延迟至今天上午11点. 2011年3月1 ...

  3. Windows服务调试小结(附Demo)

    本文版权归mephisto和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作. 阅读目录 介绍 搭建环境 调试方式 Demo下载 本文版权归mephisto和博客园共有,欢迎转载,但须 ...

  4. Silverlight 调用自托管的wcf 报跨域异常的处理

    Sileverlight很多时候需要通过wcf和后台,程序进行交互.如果 iis was托管还好,极端的遇到自托管的程序,console,windowsservice,winform,wpf等,就会出 ...

  5. 烂泥:通过binlog恢复mysql备份之前的数据

    本文由秀依林枫提供友情赞助,首发于烂泥行天下. 上一篇文章,我们讲解了如何通过mysql的binlog日志恢复mysql数据库,文章连接为<烂泥:通过binlog恢复mysql数据库>.其 ...

  6. ThreadPoolExecutor-线程池开发的使用

    好久没有写过笔记了,最近做的一个项目涉及打线程池和队列的开发,觉得在这个项目中学习到的还是挺多的,对线程安全,并发的知识有加深认知:当然,现在用过的东西并不是代表以后还能娴熟的使用,做好笔记非常重要: ...

  7. netbeans打包成jar

    文件页里找到build.xml文件,打开在</project>前 加入以下代码保存之 按 Ctrl+C 复制代码 <target name="package-for-sto ...

  8. 定时器的应用---中断方式---让8个LED灯,左右各4个来回亮

    定时器的应用---中断方式---让8个LED灯,左右各4个来回亮 /*************************** 中断方式 是主程序专注于其他的事情, 待定时器中断时才执行中断子程序. ** ...

  9. linux进程间通信-消息队列

    一 消息队列的介绍 消息队列提供了一种从一个进程向另一个进程发送一个数据块的方法. 每个数据块都被认为含有一个类型,接收进程可以独立地接收含有不同类型的数据结构. 我们可以通过发送消息来避免命名管道的 ...

  10. Sqlserver2008 数据库镜像会话的初始连接

    sqlserver2008 数据库镜像服务配置完成后,大家会发现我们有了两个数据库服务,这两个服务可以实现自动故障转移,那么我们的程序如何实现自动连接正常的数据库呢? 这个问题很简单,使用ADO.NE ...