JS对象的拷贝与继承

阳光穿透心脏的1/2处 2023-06-26 08:19 45阅读 0赞

# JS对象的拷贝 #

## 浅拷贝 ##

*  简单的把一个对象的成员值拷贝给另外一个对象，如果遇到复杂类型数据（如对象），只是将复杂类型数据的引用拷贝过去，其实两个对象的成员变量指向的还是同一个内存空间。这样 当修改一个对象的复杂类型成员变量，会影响到另外一个对象。
 *  代码：
    
        var obj1 = {
               name: 'zs',
               age: 18,
               sex: '男',
               dog: {
                 name: '金毛',
                 age: 2,
                 yellow: '黄色'
               }
             }
             var obj2 = {};
          // 封装函数  - 把o1 的成员，复制给o2
        
            // 浅拷贝
            function copy(o1, o2) {
              for (var key in o1) {
                o2[key] = o1[key];
              }
            }
            copy(obj1, obj2);
        
            // 修改obj1中的成员
            obj1.name = 'xxxx';
            obj1.dog.name = '大黄';
        
            console.dir(obj2);

### 深拷贝 ###

*  也是将一个对象的成员变量值拷贝给另外一个对象，与浅拷贝不同的是，如果成员变量是复杂类型数据（如对象），会重新创建新的复杂类型数据，再将数据的地址赋给新的对象，而不是直接把地址复制过去，这样 当修改一个对象的复杂类型成员变量，不影响另外一个。
 *  代码：

# JS对象继承 #

### 原型继承 ###

// 1 原型继承
    function Super() {
      this.color = 'red';
    }
    function Sub() {
    }
    
    Sub.prototype = new Super();
    Sub.prototype.constructor = Super;
    
    var sub = new Sub();
    console.log(sub.color);

*  原型继承的问题：无法给构造函数传参

### 借构造函数继承 ###

function Person(name, age, sex) {
      this.name = name;
      this.age = age;
      this.sex = sex;
    }
    function Student(name, age, sex, score) {
      Person.call(this, name, age, sex);
      this.score = score;
    }
    var stu = new Student('zs', 18, '男', 100);
    console.log(stu);

*  借用构造函数继承问题：无法重用方法

### 原型继承 ###

// 结合原型继承和组合式继承
    function Person(name, age, sex) {
      this.name = name;
      this.age = age;
      this.sex = sex;
    }
    Person.prototype.sayHi = function () {
      console.log(this.name);
    }
    function Student(name, age, sex, score) {
      Person.call(this, name, age, sex);
      this.score = score;
    }
    Student.prototype = new Person();
    Student.prototype.constructor = Student;
    
    var stu = new Student('zs', 18, '男', 100);
    console.log(stu);