美文网首页前端学习
WEB前端丨聊聊 Array 中的一个小坑

WEB前端丨聊聊 Array 中的一个小坑

作者: 1194b60087a9 | 来源:发表于2019-04-25 11:09 被阅读0次

    Array 类型检测

    假设obj是一个数组,我们想要实现一些功能。比如JSON.stringify就是一个例子,它以不同的方式把数组输出到其他对象。

    我们可以这样做:

    但是对于数组的子类来说这是错误的:

    所以如果你想检查子类的类型,那么应该用instanceof:

    但是当引入多个realm时,事情将会变得更加复杂:

    Multiple realms

    realm包含self引用的JavaScript全局对象。 因此,可以说在worker中运行的代码与在页面中运行的代码处于不同的realm。 在iframe之间也是如此,但同源iframe也共享一个ECMAScript'代理',这意味着对象可以穿越 realm。

    接着看代码:

    这两个都是false,因为:

    iframe有自己的数组构造函数,它与父页面中的构造函数不同。

    Array.isArray

    Array.isArray将为数组返回true,即使它们是在另一个realm中创建的。 对于任何realm的Array的子类,它也会返回true。 这就是JSON.stringify内部的处理方法。

    但是,这并不意味着arr有 array 方法。 有些甚至所有方法都已设置为undefined,或者数组可能已将其整个原型删除:

    不管怎样,如果要杜绝上述问题,可以通过Array原型调用Array的方法:

    Symbols 与 realms

    再看看这个:

    上面的logs 1, 2, 3 很不引人注目,但 for-of 循环通过调用arr[Symbol.iterator]来工作,这在某种程度上可以跨越realm。 这是如何做:

    虽然每个realm都有自己的Symbol实例,但Symbol.iterator在各个realm都是相同的。

    Symbols同时也是JavaScript中最独特和最独特的东西。

    The most unique 多唯一性

    传递给Symbol函数的字符串只是一个描述。 即使在同一realm内,这些Symbol也是独一无二的。

    The least unique 最小唯一性

    Symbol.for(str)创建一个与传递它的字符串唯一的symbol。 有趣的是它在各个realms都是一样的:

    这就是Symbol.iterator大致的工作原理。

    创建自己的 'is' 函数

    如果我们想要创建我们自己的“is”函数并跨越realm会怎么样? 好吧,Symbol允许我们这样做:

    即使实例来自另一个realm,即使它是一个子类,即使它的原型已被删除,也是可以的。

    唯一的问题是,你需要确认自己的symbol名称在所有代码中都是唯一的。 如果其他人创建了他们自己的Symbol.for('whatever-type-symbol')并使用它来表示别的东西,那么isWhatever肯定返回false。

    十五年编程经验,今年1月整理了一批2019年最新WEB前端教学视频,不论是零基础想要学习前端还是学完在工作想要提升自己,这些资料都会给你带来帮助,从HTML到各种框架,帮助所有想要学好前端的同学,学习规划、学习路线、学习资料、问题解答。只要加入WEB前端学习交流Q群:296212562,即可免费获取。

    相关文章

      网友评论

        本文标题:WEB前端丨聊聊 Array 中的一个小坑

        本文链接:https://www.haomeiwen.com/subject/hlyagqtx.html