标签:开发者 函数对象 ons http color 模拟 带来 var 无法
JS 的对象机制并不会自动执行复制行为,由于其他语言中表现出来的复制行为,因此 JS 开发者也想出了一个方式来模拟类的复制行为,这个方法就是混入。我们先看第一种,显式混入。
// 非常简单的 mixin() 例子 function mixin(sourceObj, targetObj) { for (var key in sourceObj) { // 只会在不存在的情况下复制 if (!(key in targetObj)) { targetObj[key] = sourceObj[key] } } return targetObj; } var Vehicle = { engines: 1, ignition: function() { console.log(‘Turning on my engine.‘); }, drive: function() { this.ignition(); console.log(‘Steering and moving forward!‘); } } var Car = mixin(Vehicle, { wheel: 4, drive: function(){ Vehicle.drive.call(this); console.log(‘Rolling on all ‘ + this.wheel + ‘ wheels!‘); } })
我们处理的已经不再是类了,因为在 JS 中不存在类,Vehicle 和 Car 都是对象。现在 Car 中就有了一份 Vehicle 属性和函数的副本。从技术角度来说,函数实际上没有被复制,复制的是函数引用。Car 已经有了 drive 属性,所以这个属性引用没有被 mixin 重写,从而保留了 Car 中定义的同名属性,实现了 ‘子类’ 对 ‘父类’ 属性的重写。
// 另一种混入函数,可能又重写风险 function mixin(sourceObj, targetObj) { for (var key in sourceObj) { targetObj[key] = sourceObj[key]; } return targetObj; }
var Vehicle = { // ... }
// 首先创建一个空对象并把 Vehicle 对内容复制进去 var Car = mixin( Vehicle, {} ); // 然后把新内容复制到 Car 中 mixin({ wheel: 4, drive: function() { // ... } }, Car)
这两种方法都可以把不重叠对内容从 Vehicle 中显示复制到 Car 中。‘混入’ 这个名字来源与这个过程对另一种解释: Car 中混合了 Vehicle 的内容,所以这叫混合复制。复制操作完成后, Car 和 Vehicle 分离了,向 Car 中添加属性不会影响到 Vehicle,反之亦然。
// 传统的 JS 类,Vehicle function Vehicle() { this.engines = 1; } Vehicle.prototype.ignition = function () { console.log(‘Turning on my engine.‘); } Vehicle.prototype.drive = function () { this.ignition(); console.log(‘Steering and moving forward!‘); } // 寄生类 Car function Car() { // 首先, Car 是一个 Vehicle var car = new Vehicle(); // 接着我们对 Car 进行定制 car.wheels = 4; // 保存到 Vehicle::drive() 的特殊引用 var vehDrive = car.drive; // 重写 Vehicle::drive() car.drive = function() { vehDrive.call(this); console.log(‘Rolling on all ‘ + this.wheels + ‘ wheels!‘); } return car; } var myCar = new Car() myCar.drive();
首先我们复制一份 Vehicle 父类的定义,然后混入子类的定义(如果需要的话保留父类的特殊引用),然后用这个复合对象构建实例。
标签:开发者 函数对象 ons http color 模拟 带来 var 无法
原文地址:https://www.cnblogs.com/wzndkj/p/12641139.html