Javascript 高级（1）

一、简单创建对象

        1、创建一个学生对象  属性 ：名称，身高，年龄  方法：吃饭 ，跑
        2、最基础的创建对象的方法
        3、好处：简单，方便
        4、缺点：无法进行量产 

<script>
 var students=[]
        var s1={
            name:"王一",
            height:180,
            age:21,
            eat:function(){
                console.log(this.name+"正在吃饭")
            },
            run:function(){
                console.log(this.name+"正在跑")
            }
        }
        var s2={
            name:"王一",
            height:180,
            age:21,
            eat:function(){
                console.log(this.name+"正在吃饭")
            },
            run:function(){
                console.log(this.name+"正在跑")
            }
        }
        var s3={
            name:"王一",
            height:180,
            age:21,
            eat:function(){
                console.log(this.name+"正在吃饭")
            },
            run:function(){
                console.log(this.name+"正在跑")
            }
        }
</script>

 二、工厂模式批量生产

        创建一个学生对象  属性 ：名称，身高，年龄  方法：吃饭 ，跑
        数组中存放 5个学生的数据 
        工厂模式
        好处：快速量产 
        弊端：通过工厂模式创建的对象，没法去检测对应的类型                                                                  instanceof 用于检测对应的数据类型的(简单的数据类型 数值，字符，布尔 中，必须通过new                 来创建的检测成功)                                                                                                                      typeof() 返回数据类型 三

<script>
  var students=[]
       function createStudent(name,age,height){
          var obj=new Object()
          obj.name=name
          obj.height=height
          obj.age=age
          obj.eat=function(){
              console.log(this.name+'正在吃')
          }
          return obj   //返回 对象 obj
       }
   var s1=createStudent("王一",21,180)  //返回的是导入参数的Obj对象
   var s2=createStudent("王二",22,192)
   var arr=[]
   var result = arr instanceOf object //判断arr  是否为对象
   console.log(result) // t
</script>

三、 构造函数

        javascript ：原本不存在类这个概念 
        构造函数 来模拟类 
        其他类型的语言 ，创建对象->类
        类：描述一系列相同类型事物的总称  人 动物
        构造函数：js中 this的指向性问题
        new Array() 数组对象 new Array()
        需要五个学生对象 ，创建一个学生类(构造函数 )
        学生类：name,age,height  方法 eat run
        通常构造函数的首字母大写 类的首字母大写
        构造函数方法
        好处：1.量产 2.解决了工厂模式 无法分辨指定类型的问题
        弊端：同样的方法，会开辟不同的存储空间，造成内存的大量消耗

function Student(name,age,height){     //创建student学生类 ，共有的属性
    this.name=name
    this.age=age
    this.height=height
    this.eat=function(){
         console.log(this.name+'正在吃')
    }
}  
var s1=new Student("王一",21,180)  //创建时必须使用new来创建
var s2=new Student("王二",55,58)
console.log(s1)
console.log(s2) 
console.log(s1.__proto__==s2.__proto__) //t  构造函数中的原型相等

        new 做了什么？ 面试题 
        1. 创建一个空对象 {}
        2. 将构造函数中的this指向 空对象
        3. 将构造函数中所有属性 和方法 都赋值给{}
        4. 将对象返回                                                                                                                                      5. 通过同一个类创建出来的对象 其原型 指向 共同的对象                                                                  6. __proto__ 对象的原型(构造函数产生的)

 function Teacher(name,age,height){
        this.name=name
        this.age=age
        this.height=height
        this.eat=function(){
              console.log(this.name+'正在吃')
        }
 }
var t1=new Teacher("战三",21,199)
console.log(t1)
var result=t1 instanceof Student   //t1属于构造函数teacher
console.log(result)

四、原型模式

        构造函数 ：内存消耗   共有的方法 写到原型中来节约内存  构造函数中原型 ==对象中的原型 __proto__
        将共有的方法写到构造函数的原型中 ，实例化对象以后 就可以通过原型 拿到其方法                   prototype 构造函数的原型
        __proto__ 实例化对象的原型

    function Student(name,age,height){
            this.name=name
            this.age=age
            this.height=height
        }
    Student.prototype.eat=function(){      //将共有的eat属性写到构造函数的原型中
            console.log(this.name+"正在吃")
        }
        var s1=new Student("王一",21,180)
        var s2=new Student("王二",22,222)
        s1.__proto__.run=function(){         //对象获取原型中的值
            console.log(this.name+"正在跑")
        }
    s1.run()
    s2.run() 
    s1.eat()
    console.log(s1)
    console.log(s2)
    console.log(s1.eat==s2.eat)//t
    console.log(s1.__proto__==Student.prototype)//t

五、总结

 js中如何创建对象                                                                                                                                  1.简单创建法  {}
        2.工厂模式  function()
        3.构造函数 模拟是类  通过 this的指向性的改变 来完成的对象的创建  new做了什么?
        4.原型模式  将共用的方法 放到原型上 直接进行调用