JavaScript中组合和继承的区别

JavaScript 组成： 作曲的意思是作曲。 JavaScript 中的一切都被视为对象，甚至 JavaScript 中的函数也被视为高级对象。这样的对象本质上是相当复杂的，以使大型复杂对象变得简单，将许多小对象组合在一起。因此，我们可以说组合对于如此大的复杂对象来说是更清洁、可重用和更好的解决方案。

例子：

Javascript

  const Motor = {
    accelerate(motorspeed, incrementSpeed) {
      return motorspeed + incrementSpeed;
    },
    decelerate(motorspeed, decrementSpeed) {
      return motorspeed - decrementSpeed;
    },
  };
 
  const StopMotor = {
    stop(motorspeed) {
      this.motorspeed = 0;
 
      return 0;
    },
  };
 
  const Brand = {
    model: "Maxpro",
  };
 
  const Treadmill = function (Design, Motor, StopMotor) {
    const brand = Object.create(Design);
    const motor = Object.create(Motor);
    const stopmotor = Object.create(StopMotor);
    const props = {
      motorspeed: 0,
      model: brand.model,
    };
 
    return {
      set(name, value) {
        props[name] = value;
      },
 
      get(name) {
        return props[name];
      },
 
      log(name) {
        console.log(`${name}: ${props[name]}`);
      },
 
      slowDown() {
        props.motorspeed = motor.decelerate(props.motorspeed, 5);
      },
 
      speedUp() {
        props.motorspeed = motor.accelerate(props.motorspeed, 10);
      },
 
      stop() {
        props.motorspeed = stopmotor.stop(props.motorspeed);
      },
    };
  };
 
  const Treadmill1 = Treadmill(Brand, Motor, StopMotor);
 
  // One can increase & decrease the motorspeed
  // according to their preferences
  Treadmill1.speedUp();
  Treadmill1.log("motorspeed");
  Treadmill1.slowDown();
  Treadmill1.log("motorspeed");
  Treadmill1.stop();
  Treadmill1.log("motorspeed");
  Treadmill1.log("model");
   
  // Let us change the model of Treadmill1 to Powermax
  Treadmill1.set("model", "PowerMax");
  Treadmill1.log("model");

输出：

"motorspeed: 10"
"motorspeed: 5"
"motorspeed: 0"
"model: Maxpro"
"model: PowerMax"

可以看出，上面的代码比下面的代码更干净，因为这里的机器功能和特性都是分开的。因此该类可以根据他们的要求实现适合的功能。跑步机1可以在需要时实现跑步机的功能。现在，Treadmill1 可以根据需要提高其电机速度、降低其电机转速，甚至更改其型号名称。当谈到组合时，继承会自动得到帮助。

JavaScript 继承：继承是获得父级的部分或全部特征（功能），然后提供一个似乎有点乏味的关系结构，与单独实现每个功能的类组合不同，以便每个类都可以根据它们使用功能要求。当涉及到 JavaScript 中的继承时，Mixin 起着至关重要的作用。 Mixin 实际上是混合，它可以是任何即汽车到车辆中混合意味着将汽车与车辆混合。为了正确理解这个概念，让我们以 Gym/Exercise Machine 为例，它是一个健身机 mixin。 motorspeed 用于增加、减少和停止机器，下面描述的情况是继承的，因为 Treadmill1 被分配了 Treadmill 的对象及其所有属性。因此，现在 Treadmill1 可以执行 Treadmill 的所有功能，即一个可以增加电机速度，降低电机速度，甚至可以设置我们案例中的属性，即之前是 Maxpro 和后来的 PowerMax 的品牌。

例子：

Javascript

  const machineMixin = {
    set(name, value) {
      this[name] = value;
    },
 
    get(name) {
      return this[name];
    },
 
    motorspeed: 0,
 
    inclinespeed() {
      this.motorspeed += 10;
      console.log(`Inclinedspeed is: ${this.motorspeed}`);
    },
    declinespeed() {
      this.motorspeed -= 5;
      console.log(`Declinedspeed is: ${this.motorspeed}`);
    },
 
    stopmachine() {
      this.motorspeed = 0;
      console.log(`Now the speed is: ${this.motorspeed}`);
    },
  };
 
  const Treadmill = { brand: "Maxpro", motorspeed: 0 };
  const Treadmill1 = Object.assign({}, Treadmill, machineMixin);
 
  // You can increase the speed of Treadmill1
  Treadmill1.inclinespeed();
 
  // You can even decrease the speed of Treadmill1
  Treadmill1.declinespeed();
 
  // Let's just stop the machine
  Treadmill1.stopmachine();
 
  // It's Time to access the brand of  treadmill1
  console.log(Treadmill1.get("brand"));
 
  // let's change the brand of Treadmill1
  Treadmill1.brand = "PowerMax";
  console.log(Treadmill1.get("brand"));

输出：

"Inclinedspeed is: 10"
"Declinedspeed is: 5"
"Now the speed is: 0"
"Maxpro"
"PowerMax"

在上面的输出中，可以清楚地看到所有操作都是由 Treadmill1 执行的，它被分配了具有 machinemixin 的 Treadmill 对象。首先，在应用inclinespeed() 方法后电机速度为 0，在使用下降速度方法后电机速度增加了 5执行将速度降低 5 最终停止 执行通过使电机速度为零来停止机器的操作。品牌由Maxpro改为Powermax，彰显了传承的力量。下面给出的是 Composition 和 JavaScript 之间的比较表。

Composition	Inheritance
Follows has-a relationship	Follows is-a relationship
Composition allows code-reuse.	Inheritance does not allow code-reuse.
In composition, you will no need to extend classes	In inheritance, you will need to extend classes.
In composition, you will no need to Mixin.	In inheritance, Mixin plays a major role
The composition is more flexible.	Inheritance is less flexible compared to composition.

结论：继承和组合都产生相同的结果，但实现方式很重要。组合实现方式更易于阅读并且优于第一次继承。