JavaScript ES6 Symbol.hasInstance的理解。
Symbol.hasInstance
本案例是结合阮一峰老师的ECMAScript 6 入门丛书进一步的详细介绍,和对Symbol.hasInstance的理解。本着互联网的精神,分享给大家。
对象的Symbol.hasInstance属性,指向一个内部方法。当其他对象使用instanceof运算符,判断是否为该对象的实例时,会调用这个方法。比如,foo instanceof Foo在语言内部,实际调用的是Foo[Symbol.hasInstance](foo)。
代码示例:证明x确实是MyClass的实例。
class MyClass {
}
var x = new MyClass()
console.log(x instanceof MyClass); // true
console.log(MyClass[Symbol.hasInstance](x));//true
下面的示例是阮一峰老师在ECMAScript 6 入门丛书中的案例,我个人理解为是重写了 Even[Symbol.hasInstance]的静态方法。
代码示例:
class Even {
static [Symbol.hasInstance](obj) {
return Number(obj) % 2 === 0;
}
}
x = new Even()
console.log(1 instanceof Even);//false
console.log(2 instanceof Even);//true
console.log(x instanceof Even);//true 原本判断x是否为Even的实例的方法,被改成了传入的数字%2===0。所以此刻是false。
MyClass是一个类,new MyClass()会返回一个实例。该实例的Symbol.hasInstance方法,会在进行instanceof运算时自动调用,判断左侧的运算子是否为Array的实例。
代码示例:这里相当于是修改了MyClass[Symbol.hasInstance]的动态方法
class MyClass {
[Symbol.hasInstance](foo) {
return foo instanceof Array;
}
}
var x = new MyClass()
console.log([1, 2, 3] instanceof new MyClass()); // true
console.log(x[Symbol.hasInstance]([0, 0, 0,]));//true
在举一个完整的例子。
class MyClass {
[Symbol.hasInstance](foo) {
return foo instanceof Array;
}
static [Symbol.hasInstance](obj) {
return Number(obj) % 2 === 0;
}
}
var x = new MyClass()
console.log([1, 2, 3] instanceof new MyClass()); // true //我是调用的动态方法
console.log(x[Symbol.hasInstance]([0, 0, 0,]));//true //我是调用的动态方法
console.log(2 instanceof MyClass); //true 我是调用静态方法
console.log(MyClass[Symbol.hasInstance](2));//true 我是调用了静态方法
console.log(x instanceof MyClass); //false 因为修改了静态方法。x本身就是MyClass的实例,如果注释了静态方法就会返回true。
JavaScript ES6 Symbol.hasInstance的理解。的更多相关文章
- JavaScript es6 class类的理解。
本着互联网的分享精神,在本篇文章我将会把我对JavaScript es6 class类的理解分享给大家. JavaScript 类主要是 JavaScript 现有的基于原型的继承的语法糖. 类语法 ...
- JavaScript ES6 promiss的理解。
本着互联网的分享精神,我将我对promise的理解分享给大家. JavaScript ES6的promise方法主要应用在处理异步函数返回的结果,注意他不是将异步函数转换为同步函数,而是等异步函数有结 ...
- [每日一题]面试官问:谈谈你对ES6的proxy的理解?
[每日一题]面试官问:谈谈你对ES6的proxy的理解? 关注「松宝写代码」,精选好文,每日一题 作者:saucxs | songEagle 一.前言 2020.12.23 日刚立的 flag,每日一 ...
- ES6之let(理解闭包)和const命令
ES6之let(理解闭包)和const命令 最近做项目的过程中,使用到了ES6,因为之前很少接触,所以使用起来还不够熟悉.因此购买了阮一峰老师的ES6标准入门,在此感谢阮一峰老师的著作. 我们知道,E ...
- JavaScript ES6中,export与export default
自述: 本来是对new Vue()和export default比较懵的,查了一下,发现我理解错了两者的关系,也没意识到export与export default的区别,先简单的记录一下基本概念,后续 ...
- JavaScript ES6中export、import与export default的用法和区别
前言 相信很多人都使用过export.export default.import,然而它们到底有什么区别呢? 在看他们之间的区别之前,我们先来看看它们的用法. ES6 import和export的用法 ...
- JavaScript局部变量和全局变量的理解
原文链接:http://www.cnblogs.com/eric-qin/p/4166552.html JavaScript局部变量和全局变量的理解 1 2 3 4 5 6 7 8 9 10 &l ...
- JavaScript 应用开发 #1:理解模型与集合
在 < Backbone 应用实例 > 这个课程里面,我们会一起用 JavaScript 做一个小应用,它可以管理任务列表,应用可以创建新任务,编辑还有删除任务等等.这个实例非常好的演示了 ...
- [转]JavaScript ES6 class指南
[转]JavaScript ES6 class指南 前言 EcmaScript 2015 (又称ES6)通过一些新的关键字,使类成为了JS中一个新的一等公民.但是目前为止,这些关于类的新关键字仅仅是建 ...
随机推荐
- 8-网络请求之http
本篇博客对应视频讲解 回顾 上一篇讲了Linq的使用,大家自己上手实践之后,相信一定会感到非常快捷方便.更多详细的内容还是需要自己去阅读官方文档. 今天要讲网络请求中的http请求,这也是在编程当中经 ...
- poj1166时钟翻转
#include<stdio.h> #define TABLE_LEN 5 const int table[10][TABLE_LEN]= {{},{1,2,4,5},{1,2,3},{2 ...
- Hibernate 干货2
@ORM框架 对象关系映射,用于实现面向对象编程语言里不同系统的数据之间的转换 @实例public void demo01(){ User user = new User(); user.setU ...
- 如何到python模块路径linux
执行命令whereis python即可显示出python相关的所有的路径,包括可执行文件路径,安装路径等,该方法适用于大部分类似的场景抄自百度知道
- C#控制台输出退格实现变换闪烁的字符效果
C#控制台输出退格实现变换闪烁的字符效果,传统的Console.Clear()方法能清除控制台上的所有内容. 如果用 Console.Write('\u0008');可以实现输出退格,这样就可以方便地 ...
- Class文件分析
java源码和class文件 源码: package classloader; public class TestCase { private int value; public int test() ...
- 使用IDEA结合MAVEN创建一个Spring Java Web项目
前言 如今的Java项目,如果还使用传统的把jar包复制到目录下这种原始的方式,对于依赖管理来说实在是灾难.对某个功能需要引入某种技术包,但是你不确定是否已存在,如果分类好的话还好找,若是杂在一堆不仅 ...
- Ubuntu下解决apt update时签名无效问题
Ubuntu 18.04在执行apt-get update时出现一下报错: W: GPG 错误:http://repo.mysql.com/apt/ubuntu bionic InRelease: 下 ...
- C#-WebForm-LinQ-条件精确查询、高级查询
前台界面,并在后台绑定数据 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Ca ...
- git已经删除了远程分支,本地仍然能看到
1.使用 git branch -a 命令可以查看所有本地分支和远程分支,发现很多在远程仓库已经删除的分支在本地依然可以看到. 2.使用命令 git remote show origin,可以查看re ...