js 面向对象编程之多继承

作者: tww844475003 分类: 前端开发 发布时间: 2021-05-23 16:02

单继承

var extend = function(target, source) {
    // 遍历源对象中的属性
    for (var property in source) {
      // 将源对象中的属性复制到目标对象中
      target[property] = source[property];
    }

    // 返回目录对象
    return target;
  }

  var book = {
    name: 'Javascript设计模式',
    alike: ['css', 'html', 'Javascript']
  }
  var anotherBook = {
    color: 'blue'
  }
  extend(anotherBook, book);
  console.log(anotherBook.name); // Javascript设计模式
  console.log(anotherBook.alike); // ['css', 'html', 'Javascript']
  anotherBook.alike.push('ajax');
  anotherBook.name = '设计模式';
  console.log(anotherBook.name); // 设计模式
  console.log(anotherBook.alike); // ['css', 'html', 'Javascript', 'ajax']
  console.log(book.name); // Javascript设计模式
  console.log(book.alike); // ['css', 'html', 'Javascript', 'ajax']

多继承

  var mix = function() {
    var i = 1,
      len = arguments.length,
      target = arguments[0],
      arg;
    
    // 遍历被继承的对象
    for(; i < len; i++) {
      // 缓存当前对象
      arg = arguments[i];
      // 遍历被继承对象中的属性
      for(var property in arg) {
        // 将被继承对象中的属性复制到目标对象中
        target[property] = arg[propery];
      }
    }

    // 返回目录对象
    return target;
  }

  Object.prototype.mix = function() {
    var i = 0,
      len = arguments.length,
      target = arguments[0],
      arg;
    
    // 遍历被继承的对象
    for(; i < len; i++) {
      // 缓存当前对象
      arg = arguments[i];
      // 遍历被继承对象中的属性
      for(var property in arg) {
        // 将被继承对象中的属性复制到目标对象中
        this[property] = arg[property];
      }
    }
  }

  var book1 = {
    name: 'javascript'
  }
  var book2 = {
    about: '一本javascript书'
  }
  var otherBook = {
    color: 'red'
  }

  otherBook.mix(book1, book2);
  console.log(otherBook); // {color: "red", name: "javascript", about: "一本javascript书", mix: ƒ}
前端开发那点事
微信公众号搜索“前端开发那点事”

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注