创建对象的方法与对象属性的继承

---

前言

在js中有很多创建对象的方法，对象是在js中非常常用的，本文章将讲解对象如何创建，创建对象时里面出现的问题，还有对象属性的继承

---

一、创建对象的方法

1.1 Object方法

let  p = new Object(); 
     p.name='123';
     console.log(p);
下面时运行结果

1.2 采用工厂函数法

 采用工厂函数可以批量生产对象

function person(name,age,sex){
          let p = new Object()
          p.name=name;
          p.age=age;
          p.sex=sex;
          p.chifan=function(){
            console.log('吃饭');
          }
          return p;
}

let  p1 = new person('小明','13','男')
console.log(p1);
let p2 = new person('小李','15','女')
console.log(p2);
下面时工厂函数的结果

虽然工厂函数生产的对象属性名和方法名相同，但是他们不是同一个对象接下来是代码验证

console.log(p1==p2);
console.log(p1.chifan==p2.chifan);

在这里面会存在一个问题，就是我们每次生产一个对象都会生产同样的函数，这样会造成内存上的浪费，那么我们怎么处理这个问题，我们留下这个问题把他放在之后解决

1.3 使用new 一个构造函数法

首先在写代码之前我们要先了解new 和this的作用
1.创建了一个空对象
2.调用了构造函数
3.将构造函数中的this指向指向了当前创建的实例化对象
4.执行了构造函数中的内部代码
5.返回了 this
我们说一下这里this的意思 在构造函数中指向的是它的实例化对象
接下来是代码演示

function person(name,age,sex){
    this.name =name ;
    this.age=age;
    this.sex=sex;
    this.chifan=function(){
        console.log('吃饭');
    }
}
let p = new person('里斯','12','男的')
let p1 = new person('小李','15','女的')
console.log(p);
console.log(p1)
下面是结果

当然这里也遇见了我们之前提到的问题那么我们就在这里处理上面说到的那个问题，首先要先了解一个概念如果构造函数想要访问原型的要构造函数.prototype，如果实例对象想要访问原型的话格式是：实例对象.__proto __，接下来我们代码操作时间.

function person(name,age,sex){
    this.name =name ;
    this.age=age;
    this.sex=sex;
}
person.prototype.chi=function(){
    console.log('chi');
}
let p = new person('里斯','12','男的')
let p1 = new person('小李','15','女的')
console.log(p);
console.log(p1);
p.__proto__.chi()
下面是运行结果``

二、对象属性的继承

需求分析

每个人都有名字年龄性别，如果我们给每个对象都去定义这些属性，会导致我们的代码量大大增加，对象的属性继承是为了减少我们的代码量，将相同的变量都定义在一个构造函数中

2.1.call方法

call方法() 借用
方法的使用语法格式:
构造函数.call(对象,参数,参数,…)
call方式的作用是什么??
1.可以修改this指向 => call 方法中的第一个参数是什么,就会将前边的构造函数中的this指向修改成什么
2.可以调用函数

function person(name,age,sex){
    this.name=name;
    this.age=age;
    this.sex=sex
}

function teacher(name,age,sex,tcid){
    person.call(this,name,age,sex)
    this.tcid=tcid
}
function stu(name,age,sex,classid){
    person.call(this,name,age,sex)
     this.classid=classid;
}
let tc1=new teacher('黎明','12','男','23');
let stu1 = new stu('丹尼','3','女','203210234')
console.log(tc1);
console.log(stu1);

2.2 applyf方法

apply()方法
（1） 他会改变this指向
（2）会调用函数
语法格式： apply(改变this指向,数组)需要注意他是以数组传参的

function person(name,age,sex){
    this.name=name;
    this.age=age;
    this.sex=sex
}

function teacher(name,age,sex,tcid){
    person.apply(this,arguments)
    this.tcid=tcid
}
function stu(name,age,sex,classid){
    person.call(this,arguments)
     this.classid=classid;
}
let tc1=new teacher('黎明','12','男','23');
let stu1 = new stu('丹尼','3','女','203210234')
console.log(tc1);
console.log(stu1);
下面是运行效果

## 2.3 bind方法
(1)bind方法并不会执行函数
(2) 能够改变this指向
(3)如果不修改this指向他会返回一个他原来的函数 一般用于改变this指向

<div class="box">

</div>
<button id="btn">点击</button>
    <script>
   let btn = document.getElementById('btn');
    let box = document.querySelector('.box')

    btn.onclick=function(){
        let div=  document.createElement('div')
         box.append(div)
       div.onclick=function(){
        console.log(this);
       }.bind(this)  
    }
</script>
下面是效果演示

总结

一般常用的创建对象的方法就是工厂函数法和new构造函数法，工厂函数可以批量生产对象，对象属性的继承也很重要，可以大大减少我们的代码量