JavaScript 的 Mixin 问题
JavaScript 从 ES6 开始支持 class 了, 如何在现在的 class 上实现 mixin 呢? 很多人推荐这种搞法
Object.assign(MyClass.prototype, MyMixin);
这个做法很丑, 不能令人满意。
我找到了一个更有趣的做法,和 dart 比较接近:
"Real" Mixins with JavaScript Classes
他最终的做法是这样的:
class MyClass extends mix(MyBaseClass).with(Mixin1, Mixin2) {
/* ... */
}
Mixin1 Mixin2 的定义是
let Mixin1 = (superclass) => class extends superclass {
foo() {
console.log('foo from Mixin1');
if (super.foo) super.foo();
}
};
let Mixin2 = (superclass) => class extends superclass {
foo() {
console.log('foo from Mixin2');
if (super.foo) super.foo();
}
};
class S {
foo() {
console.log('foo from S');
}
}
class C extends Mixin1(Mixin2(S)) {
foo() {
console.log('foo from C');
super.foo();
}
}
new C().foo();
要点是 class 在 js 里性质和 function 相似, 都具有闭包性, 因此可以通过函数构造出来.
说到这个前两天根据我们需要什么样的 ORM 框架 - Inshua - 博客园的思考, 正好试验了这个特征:
function nvarchar(n){
return class{
constructor(){
this.size = n;
}
}
}
var t = nvarchar(200);
var c = new t();
看起来效果还可以, 但是 JavaScript 变量不支持类型, 所以目前还无法发挥它的实力.
Flow 和 TypeScript 能给 JavaScript 添加类型, 但都没有很好的往这个方向走. Dart 就不用考虑了, class 不能定义在 function 里, 也不能作为值使用. 可能裁剪的 TypeScript 是比较适当的选择, 但是我不想使用这种生成 js 的套盒语言.
JavaScript 的 Mixin 问题的更多相关文章
- javascript模式——Mixin
Mixin是一种扩展收集功能的方式,能提高代码的复用率. 在javascript中,原型可以继承于其它对象的原型,并且可以为任意数量的实例定义属性.可以利用这一点来促进函数的复用. 下面一段代码就是将 ...
- 【javascript】javascript设计模式mixin模式
概述: Mixin是JavaScript中用的最普遍的模式,几乎所有流行类库都会有Mixin的实现.任意一个对象的全部或部分属性拷贝到另一个对象上. 一 .混合对象 二 .混合类
- Erlang入门(一)
读erlang.org上面的Erlang Course四天教程1.数字类型,需要注意两点1)B#Val表示以B进制存储的数字Val,比如 7> 2#101.5 二进制存储的101就是10进制的5 ...
- vue.js过度&动画、混入&插件
1.vue 过度动画 1.过度 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果.Vue 提供了内置的过渡封装组件,该组件用于包裹要实现过渡效果的组件. 语法格式: < ...
- 从mixin到new和prototype:Javascript原型机制详解
从mixin到new和prototype:Javascript原型机制详解 这是一篇markdown格式的文章,更好的阅读体验请访问我的github,移动端请访问我的博客 继承是为了实现方法的复用 ...
- JavaScript 中的数据类型
Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...
- JavaScript面向对象之我见
序言 在JavaScript的大世界里讨论面向对象,都要提到两点:1.JavaScript是一门基于原型的面向对象语言 2.模拟类语言的面向对象方式.对于为什么要模拟类语言的面向对象,我个人认为:某些 ...
- ES6新特性:使用新方法定义javascript的Class
ES6中定义类的方式, 就是ES3和ES5中定义类的语法糖,虽然也有些区别,但是整体定义类的方式更加简洁,类的继承更加方便, 如果想对ES6中的继承更加熟悉, 最好了解ES5中原型继承的方式, 博客园 ...
- javascript中的对象,原型,原型链和面向对象
一.javascript中的属性.方法 1.首先,关于javascript中的函数/“方法”,说明两点: 1)如果访问的对象属性是一个函数,有些开发者容易认为该函数属于这个对象,因此把“属性访问”叫做 ...
- JavaScript的面向对象编程(OOP)(三)——聚合
之前写过了类和原型,这里再说聚合,在写关于聚合之前,对与继承我再总结一下.JavaScript中关于继承的方式一共有三种,之前写了两种,但是没有说明,这里补充说明一下. 1.类式继承:通过在函数对象内 ...
随机推荐
- jpa 多条件模糊查询,分页并排序
jpa 多条件模糊查询,分页并排序很难吗,这样写不就几行代码的事吗?搞不明白你们写的怎么长篇大论花里胡哨的,看的一脸懵逼. jpa多字段模糊查询,持久层字段还是要一一对应的,但是你可以在service ...
- Android Qcom USB Driver学习(二)
BC v1.2充电规范 Battery Charging Specification USB port 如何识别不同的Charger类型 USB Charger类型 USB_SDP_CHARGER P ...
- 网络波动下的救星:ToDesk云电脑性能测试,以赛博朋克2077、巫师3为例
随着网络技术的不断发展,云电脑作为一种新兴的云端计算机逐渐进入大众视野.对于游戏玩家而言,云电脑不仅解决了高配置电脑价格昂贵的问题,还让玩家在任何网络环境下随时随地享受高性能的游戏体验. 特别是在网络 ...
- [图像处理] 基于CleanVision库清洗图像数据集
CleanVision是一个开源的Python库,旨在帮助用户自动检测图像数据集中可能影响机器学习项目的常见问题.该库被设计为计算机视觉项目的初步工具,以便在应用机器学习之前发现并解决数据集中的问题. ...
- 快速上手web前端开发(超详细教程)
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言 第一步 下安装vscode 第二步 vscode汉化 第三步 安装前端所需插件 1.Live Server 2.Jav ...
- 经验总结之 _DEBUGGER _03 _Server Tomcat v8.0 Server at localhost was unable to start within xx seconds
经验总结之 _DEBUGGER _03 _Server Tomcat v8.0 Server at localhost was unable to start within xx seconds 好好 ...
- C:二进制向十进制变换
#include<stdio.h> int main() { char z[66]; scanf("%s",z); unsigned long long sum=0; ...
- linux下时间时区详解
首先我们要明白,"时间"和"时区"是两个东西. 时间是指从某个时间点开始到另一个时间点经过的"长度",是"纵向"距离,一 ...
- Redis数据结构:List类型全面解析
文章目录 一.List数据类型 1.1 简介 1.2 应用场景 1.3 底层结构 二.数据结构 2.1 压缩列表ZipList 2.2 双向链表LinkedList(后续已废弃) 2.3 快速链表Qu ...
- PHP word PDF excel 文档互转 预览 (linux libreoffice)
1--卸载系统当前的libreoffice 执行如下命令:yum remove libreoffice-* 2--为了能使用镜像,在etc 目录之下的hosts文件内加入代理. 注意没有加的话,可能 ...