V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
Sparetire
V2EX  ›  JavaScript

ES6 中 Proxy 的 getPrototypeOf 陷阱是怎么回事?

  •  1
     
  •   Sparetire · 2019-03-23 15:43:45 +08:00 · 3830 次点击
    这是一个创建于 2106 天前的主题,其中的信息可能已经有所发展或是发生改变。

    如下代码

    function Test() {
    }
    
    const a = new Proxy({}, {
    	getPrototypeOf() {
    		return Array.prototype;
    	}
    });
    
    console.log(a instanceof Array); // true
    
    const b = new Proxy({}, {
    	getPrototypeOf() {
    		return Test.prototype;
    	}
    });
    
    console.log(b instanceof Test); // false
    console.log(b instanceof Test); // true
    console.log(b instanceof Test); // true
    

    为什么 a, b 两个的结果完全不一样, 原生类和我自己定义的类难道有什么区别?

    而对于后面两个结果, 难道 getPrototypeOf 存在副作用?

    另一个例子如下

    class Test {}
    
    const a = new Proxy({}, {
    	getPrototypeOf() {
    		return Array.prototype;
    	}
    });
    
    console.log(a instanceof Array); // true
    
    const b = new Proxy({}, {
    	getPrototypeOf() {
    		return Test.prototype;
    	}
    });
    
    console.log(b instanceof Test); // true
    console.log(b instanceof Test); // true
    console.log(b instanceof Test); // true
    

    如果把函数换成 class, 则出现了预期之中的结果, 但是 js 中 class 不是仅仅是语法糖吗? 为什么会有这样的区别?

    第 1 条附言  ·  2019-03-23 17:10:46 +08:00
    补充环境
    Node v10.15.1 64bit 和 Chrome 73.0.3683.86 复现
    FF 66.0.1 64bit 则全都是 true, 符合预期
    第 2 条附言  ·  2019-03-23 18:05:19 +08:00

    再补充下, 使用 Object.getPrototypeOf() 则结果都符合预期, 出问题的只有 instanceof

    function Test() {
    }
    
    const a = new Proxy({}, {
    	getPrototypeOf() {
    		return Array.prototype;
    	}
    });
    
    console.log(Object.getPrototypeOf(a) === Array.prototype); // true
    
    const b = new Proxy({}, {
    	getPrototypeOf() {
    		return Test.prototype;
    	}
    });
    console.log(Object.getPrototypeOf(b) === Test.prototype); // true
    console.log(Object.getPrototypeOf(b) === Test.prototype); // true
    console.log(Object.getPrototypeOf(b) === Test.prototype); // true
    
    12 条回复    2019-03-24 23:34:06 +08:00
    jyz19880823
        1
    jyz19880823  
       2019-03-23 16:24:04 +08:00
    这应该是 chrome 和 v8 的 bug 吧
    至少 safari 和 firefox 都是好的
    Sparetire
        2
    Sparetire  
    OP
       2019-03-23 17:12:32 +08:00
    @jyz19880823 看起来的确是的...FF 下面的结果都是 true, 符合期望
    azh7138m
        3
    azh7138m  
       2019-03-23 17:52:13 +08:00
    v11.12 同复现,很有趣,也觉得是 v8 的 bug
    Sparetire
        4
    Sparetire  
    OP
       2019-03-23 18:16:53 +08:00
    @azh7138m 而且只有 instanceof 有这么个问题, Object.getPrototypeOf()就很正常...
    ayase252
        5
    ayase252  
       2019-03-23 18:23:48 +08:00 via iPhone
    有趣的一点是如果在第一个例子 console.log(b instance of Test)之前加一行 Object.getPrototypeOf(b)之后又很正常。我倾向认为是引擎的 bug ?
    azh7138m
        6
    azh7138m  
       2019-03-23 18:29:42 +08:00   ❤️ 1
    这里的 b instanceof Test 等效于 Test[Symbol.hasInstance].call(Test, b)
    Object.getPrototypeOf 则是取的[[Prototype]]
    两者不同
    具体的我不知道今天能不能看完
    Sparetire
        7
    Sparetire  
    OP
       2019-03-23 20:34:50 +08:00
    @ayase252 是的, 并且在下面这个例子中也会有区别
    ```javascript
    function Test() {
    return new Proxy({}, {
    getPrototypeOf() {
    return Test.prototype;
    }
    });
    }

    const a = Test();
    console.log(a instanceof Test); // false

    const b = new Test();
    console.log(b instanceof Test); // true
    ```
    然而同样 FF 中则都是 true, 所以也倾向于是引擎的 bug 吧
    不过真是走狗屎运, 在生产上碰到这么个 bug...
    azh7138m
        8
    azh7138m  
       2019-03-24 01:03:53 +08:00   ❤️ 1
    azh7138m
        9
    azh7138m  
       2019-03-24 01:08:48 +08:00
    顺便更正下我 6L 的结论

    https://www.ecma-international.org/ecma-262/9.0/#sec-object.getprototypeof

    所以 Object.getPrototypeOf(b) 并不是取的[[Prototype]],而是 b.[[GetPrototypeOf]](),所以结果都符合预期
    Sparetire
        10
    Sparetire  
    OP
       2019-03-24 01:34:22 +08:00   ❤️ 1
    @azh7138m
    @ayase252
    @jyz19880823
    hax 大佬说这里是 V8 的一个 bug
    https://www.zhihu.com/question/317137493?rf=317137501
    So, 结帖
    MinonHeart
        11
    MinonHeart  
       2019-03-24 22:02:47 +08:00 via iPhone
    v8 优化带来的额外 bug,这也不是一个两个了,之前有个 canvas 的 bug 至今没修。直接去 crbug 提交 bug
    Sparetire
        12
    Sparetire  
    OP
       2019-03-24 23:34:06 +08:00 via Android
    @MinonHeart 嗯,提交了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   949 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 22:26 · PVG 06:26 · LAX 14:26 · JFK 17:26
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.