代码片段一:

alert(Function instanceof Object); // true
alert(Object instanceof Function); // true

Function 是 Object 的实例,Object 也是 Function 的实例,好“纠缠”的关系。

代码片段一:

alert(Object.forEach); // undefined

Function.prototype.forEach = function(object, block, context) {
    for (var key in object) {
        if (typeof this.prototype[key] == "undefined") {
            block.call(context, object[key], key, object);
        }
    }
};

alert(Object.forEach);
alert(Function.forEach);
alert(Object.forEach === Function.forEach); // true

给 Function 设置的原型方法 forEach,“有趣”的是 Object 也能够获取。

至于为什么可以从 JavaScript Object layout 图中获取部分解答:

JavaScript Object layout

看懂上图了没?如果看懂了,留道思考题给大家:

function Foo() {};
var foo = new Foo();

alert(foo instanceof Foo); // ?
alert(foo instanceof Object); // ?
alert(foo instanceof Function); // ?
alert(Foo instanceof Function); // ?
alert(Foo instanceof Object); // ?


共有15 条评论

  1. 1. 头像 mier

    好纠结的关系

  2. 2. 头像 涵宇

    沙发
    Function 是 Object 的实例,Object 也是 Function 的实例好

    由于此种“纠结”的关系,可以更方便地进行原型方法扩张吧!

  3. 3. 头像 万峰

    沙发~

  4. 4. 头像 simaopig

    这种东西太烦人了,__proto__指向的是其构造函数的原型对象。

    从图中,f1和f2都是foo的实例,也是Object的实例,

    而Foo是Function和Object的实例,好纠结。

    所以,貌似思考题中的,只有第三个是false吧?

  5. 5. Tweets that mention 与 Function 和 Object 相关的有趣代码 _ PlanABC – 怿飞’s Blog -- Topsy.com

    [...] This post was mentioned on Twitter by 怿飞 and Fdream, Fdream. Fdream said: Object和Function的纠结关系(怿飞 @blankzheng):http://is.gd/bXIn2 [...]

  6. 6. 行骏-IT Player » Blog Archive » Function function Object

    [...] 看云谦的与 Function 和 Object 相关的有趣代码,公布下答案: 1 2 3 4 5 6 7 function Foo() {}; var foo = new Foo(); alert(foo instanceof Foo); // true alert(foo instanceof Object); // true alert(foo instanceof Function); // false alert(Foo instanceof Function); // true alert(Foo instanceof Object); // true [...]

  7. 7. 头像 小白

    我想知道,图是用什么软件画的

  8. 8. 头像 norm

    是不是因为Object()和Function本身就是一个构造函数,也就是说他们本身就是一个function,自然可以访问到function.prototype下面的方法,同理String.forEach、RegEx.forEach应该也没问题。

    而js里又设定所有对象都是Object的实例
    所以就出现了上面的奇怪现象?

  9. 9. javascript 面向对象编程(1) @ 7XLOVE(七夕之恋)

    [...] 变态的function与object,详见:http://www.planabc.net/2010/05/06/interesting_code_associated_with_function_and_object/ [...]

  10. 10. 简单扯蛋一下js中的typeof和instanceof - 乱搞js和jquery - function - instanceof - js - object - typeof - undifined - 一用 - 变量 - 实例 - 对象 - 数组 - 麦穗

    [...] 今天在怿飞的与 Function 和 Object 相关的有趣代码中发现了instanceof,觉得听陌生的,就去网上查了些资料。 [...]

  11. 11. JavaScript中函数与原型对象关系 | Wang Jun's Blog

    [...] http://www.mollypages.org/misc/js.mphttp://blog.morrisjohns.com/illumination_on_javascript_prototypes.htmlhttp://www.planabc.net/2010/05/06/interesting_code_associated_with_function_and_object/ [...]

  12. 12. 头像 Tony Lee

    function Foo() {};
    var foo = new Foo();

    alert(foo instanceof Foo); // => true
    因为在对象foo的原型链上找到了构造函数 Foo
    代码表示:foo.__proto__.constructor === Foo

    alert(foo instanceof Object); // => true
    因为在对象foo的原型链上找到了构造函数 Object
    代码表示:foo.__proto_.__proto__.constructor === Object

    alert(foo instanceof Function); // => false
    foo对象的原型链没有 Function 函数

    alert(Foo instanceof Function); // => true
    因为函数Foo的构造函数是Function
    代码表示:Foo.__proto__.constructor === Function

    alert(Foo instanceof Object); // => true
    代码表示:Foo.__proto__.__proto__.constructor === Object

    另外:这个JavaScript对象布局图很给力,仔细研读后,豁然开朗!!!

  13. 13. 头像 Tony Lee

    我的评论看不到?

  14. 14. 头像 idamag

    好图,收藏了。
    12楼解释的很好啊~
    原来Function不是直接实例化自Object,而是Function.__proto__.__proto__ === Function.prototype.__proto__ === Object.prototype 间接而来的

  15. 15. 与 Function 和 Object 相关的有趣代码 | Jim的blog

    [...] 上午 11:33,并被分类于JS/Ajax/AS/Flex。 您可以通过订阅 RSS 2.0 跟踪对这篇文章的评论, 也可以发表您的评论,或者在您自己的网站中 [...]

发表评论

(必填)

(必填,会为您保密)

评论仅支持“a、abbr、strong、em、blockquote、code”几个简单的标签