function foo的原型与prototype属性解惑

疑惑出自于：


代码如下:

function foo {
　　this.name = 'foo';
}
alert(foo.prototype === Function.prototype ); //false。 当时一直没想明白为啥foo的原型不是Function.prototype。

下面例子让我想当然的认为o.prototype === Function.prototype 应该为true的：


代码如下:

function foo() {
　　this.name = 'foo';
}
Function.prototype.sayHello = function (parent) {
　　alert('hello');
};
foo.sayHello(); //alert 'hello'

当我给Function.prototype增加了一个sayHello的方法后，foo也从原型身上得到了sayHello。用调试器观察了一下，查了一下资料（包括ECMA-262 http://dmitrysoshnikov.com/ecmascript/chapter-5-functions/ 以及 《JavaScript the good parts》第五章5.1 Pseudoclassical） ，发现foo.prototype的定义如下：
this.prototype = {constructor: this}; //这里是foo.prototype = {constructor: foo};
顺便做了以下测试
alert(foo === foo.prototype.constructor); //true

那foo.prototype到底是什么？这跟new关键字有密切的关系。说一下new foo()干了些什么就知道了。
var obj = {}; //定义一个新的Object
obj.[[prototype]] == this.prototype;
//注意1：此处的this为foo，foo.prototype此时有用武之地了，给obj的原型赋值，在此用[[prototype]]表示其原型
//注意2：obj是没有prototype属性的，估计是没用吧
var other = this.apply(obj, arguments); //这部让obj.name = 'foo'，即obj作为this跑了一遍foo函数
return (typeof other === 'object' && other) || that; //如果foo函数返回了一个对象，则返回该对象，否则返回obj。

这样就很清楚了，new foo()的时候，foo创建了一个对象，并作为其构造函数，而foo.prototype则作为新对象的原型来使用。
foo.prototype可以添加任意方法，或改为任意的对象，而不怕修改了Function.prototype（Function.prototype是所有函数的原型）;
this.prototype = {constructor: this};的意义就在于，在没有手动指定foo.prototype的情况下，js指定了一个默认的原型给new出来的新对象。

赞 (0)

相关推荐

  • Function.prototype.apply()与Function.prototype.call()小结

    老是忘掉这两个东东的用下,写下来做个记录吧. 他们作用是一模一样的,只是传入的参数不一样 apply apply接受两个参数,第一个制定了函数体内this对象的指向,第二个参数为一个带下标的集合(可遍历对象),apply方法把这个集合中的元素作为参数传递给被调用的函数: var func = function(a, c, c){ alert([a,b,c]); //[1,2,3] } func.apply(null, [1,2,3]); call call传入的参数不固定,和apply相同的是,

  • 慎用 somefunction.prototype 分析

    复制代码 代码如下: // code from jb51.net function Person(name) { this.Name = name; } Person.prototype.SayHello = function() { alert('Hello, ' + this.Name); } Person.prototype.SayBye = function() { alert('Goodbye, ' + this.Name); } 不过,有的时候,为了书写以及维护的方便,我们会把公有方

  • Function.prototype.bind用法示例

    复制代码 代码如下: //ECMAScript 5 Function.prototype.bind函数兼容处理 (function(){ if ( !Function.prototype.bind ) { //function(){}.bind Function.prototype.bind = function ( o, /*参数列表*/ ) { var self = this, boundArgs = Array.prototype.slice.call(arguments, 0); ret

  • Prototype Function对象 学习

    这个对象就是对function的一些扩充,最重要的当属bind方法,prototype的帮助文档上特意说了一句话:Prototype takes issue with only one aspect of functions: binding.其中wrap方法也很重要,在类继承机制里面就是利用wrap方法来调用父类的同名方法.argumentNames bind bindAsEventListener curry defer delay methodize wrap 复制代码 代码如下: //通

  • Function.prototype.call.apply结合用法分析示例

    昨天在网上看到一个很有意思的js面试题,就跟同事讨论了下,发现刚开始很绕最后豁然开朗,明白过来之后发现还是挺简单的,跟大家分享下! 题目如下:var a = Function.prototype.call.apply(function(a){return a;}, [0,4,3]);alert(a); 分析步骤如下: 1.将Function.prototype.call当成整体,call方法是由浏览器实现的本地方法,是函数类型的内部方法 var a = (Function.prototype.c

  • function foo的原型与prototype属性解惑

    疑惑出自于: 复制代码 代码如下: function foo { this.name = 'foo'; } alert(foo.prototype === Function.prototype ); //false. 当时一直没想明白为啥foo的原型不是Function.prototype. 下面例子让我想当然的认为o.prototype === Function.prototype 应该为true的: 复制代码 代码如下: function foo() { this.name = 'foo';

  • 基于JavaScript实现继承机制之原型链(prototype chaining)的详解

    如果用原型方式重定义前面例子中的类,它们将变为下列形式: 复制代码 代码如下: function ClassA() {} ClassA.prototype.color = "blue";ClassA.prototype.sayColor = function () {    alert(this.color);}; function ClassB() {} ClassB.prototype = new ClassA(); 原型方式的神奇之处在于最后一行代码.这里,把 ClassB 的

  • JavaScript中的原型prototype属性使用详解

    prototype属性可以将属性和方法添加到任何对象(Number, Boolean, String 和Date等). 注:原型(Prototype)是一个全局的属性,它可以使用在几乎所有的对象. 语法 object.prototype.name = value 实例: 这里有一个例子展示了如何使用原型(prototype)属性的属性添加到对象: <html> <head> <title>User-defined objects</title> <sc

  • JavaScript类和继承 prototype属性

    我们已经在第一章中使用prototype属性模拟类和继承的实现. prototype属性本质上还是一个JavaScript对象. 并且每个函数都有一个默认的prototype属性. 如果这个函数被用在创建自定义对象的场景中,我们称这个函数为构造函数. 比如下面一个简单的场景: 复制代码 代码如下: // 构造函数 function Person(name) { this.name = name; } // 定义Person的原型,原型中的属性可以被自定义对象引用 Person.prototype

  • JavaScript prototype属性深入介绍

    每个函数创建时默认带有一个prototype属性,其中包含一个constructor属性,和一个指向Object对象的隐藏属性__proto__.constructor属性的值为该函数的对象.在一个函数前面加上new来调用,则会创建一个隐藏连接到该函数prototype成员的新对象(由__proto__属性来链接),同时函数的this将会被绑定到那个新对象上. 函数总是返回一个值:如果没有指定返回值,就返回undefined:如果当做构造函数来调用,且返回值不是对象,则返回this(该新对象):

  • JavaScript prototype属性详解

    JavaScript prototype属性详解

    每个函数都有一个prototype属性,这个属性是指向一个对象的引用,这个对象称为原型对象,原型对象包含函数实例共享的方法和属性,也就是说将函数用作构造函数调用(使用new操作符调用)的时候,新创建的对象会从原型对象上继承属性和方法. 私有变量.函数 在具体说prototype前说几个相关的东东,可以更好的理解prototype的设计意图.之前写的一篇JavaScript 命名空间博客提到过JavaScript的函数作用域,在函数内定义的变量和函数如果不对外提供接口,那么外部将无法访问到,也就是

  • js资料prototype 属性

    资料:prototype 属性 返回对象类型原型的引用. objectName.prototype objectName 参数是对象的名称. 说明 用 prototype 属性提供对象的类的一组基本功能.对象的新实例"继承"赋予该对象原型的操作. 例如,要为 Array 对象添加返回数组中最大元素值的方法.要完成这一点,声明该函数,将它加入 Array.prototype,并使用它. 复制代码 代码如下: function array_max( ){   var i, max = th

  • 谈谈js中的prototype及prototype属性解释和常用方法

    谈谈js中的prototype及prototype属性解释和常用方法

    prototype是javascript中笔记难理解的一部分内容,下面通过几个关键知识点给大家讲解js中的prototype.具体内容请看下文详情. 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展.我们称B的原型为A. 2 javascript的方法可以分为三类: a 类方法 b 对象方法 c 原型方法 例子: function People(name) { this.name=na

  • 理解JavaScript的prototype属性

    其实,关于prototype只要几句话就可以总结: 任何原型都是对象,只有对象有原型 只有Function有prototype属性,它是这个Function作为构造器时生成对象所继承的原型.Function的原型和它的prototype属性无关 对象的原型可以通过非标准的属性 __proto__ 或ECMAScript5的方法 Object.getPrototypeOf() 访问. 1其实是错的,Object这个原型链尽头的对象它没有原型.可是为了更简单表述.在看原型链后你就会明白.toStri

  • js的Prototype属性解释及常用方法

    js的Prototype属性解释及常用方法

    函数:原型 每一个构造函数都有一个属性叫做原型(prototype,下面都不再翻译,使用其原文).这个属性非常有用:为一个特定类声明通用的变量或者函数. prototype的定义 你不需要显式地声明一个prototype属性,因为在每一个构造函数中都有它的存在.你可以看看下面的例子: Example PT1 复制代码 代码如下: function Test(){}alert(Test.prototype); // 输出 "Object" 给prototype添加属性 就如你在上面所看到

随机推荐