zoukankan      html  css  js  c++  java
  • js中的面向对象(一)封装

    1.简单的封装(定义)

      //cart1 具有三个属性
    var cat1 = {}; cat1.name = '阿黄'; cat1.sex = '男'; cat1.age = 11;
    //cat2 也同样具有三个属性 var cat2 = {}; cat2.name = '小黑'; cat2.sex = '女'; cat2.age = '10';

    把cat1和cat2看成是一个对象,它们都具有三个属性。

    缺点:一时如果有多个对象,写起来就比较麻烦,二是实例和原型之间没有任何联系。

    2.原始模型封装(在1的基础上进行改进)

    function Cat(name,sex,age){
            return {
                name:name,
                sex:sex,
                age:age
            }
    
        }
        var cat1 = Cat('小黄','男','11');
        var cat2 = Cat('小黑','女','10');
        alert(cat1.name);

    缺点:cat1和cat2没有什么内在联系,不能反应他们是同一原型对象的实例。

    3.构造函数的封装

    function Cat(name,age,sex){
        this.name = name;
        this.sex = sex;
        this.age = age;
    }
    var cat1 = new Cat('小黄','男','11');
    var cat2 = new Cat('小黑','女','10');

    表面上是没有什么缺点,但是如以下代码

    function Cat(name,age,sex){
        this.name = name;
        this.sex = sex;
        this.age = age;
        this.type = '猫科动物';
    }
    var cat1 = new Cat('小黄','男','11');
    var cat2 = new Cat('小黑','女','10');

    cat1和cat2都是属于猫科动物,但是在创建对象原型Cat的实例cat1和cat2时都会创建一次type属性;这样就会造成内存的浪费。

    4.prototype模式

    function Cat(name,sex,age){
        this.name = name;
        this.sex = sex;
        this.age = age;
    }
    Cat.prototype.type = '猫科动物';
    Cat.prototype.say = function (){alert("喵喵");};
    var cat1 = new Cat();
    alert(cat1.type);

    原理:Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。

    个人理解是将相同的属性“放在”一个内存之中,当创建cat1和cat2实例时,他们的属性都会指向同一个内存,从而不用重复创建。

    prototype验证

    1)isPrototypeOf

    2)hasOwnProperty

    3)in

    本文参考: 阮一峰的博客

     谢谢大家关注,小的将不屑努力!!! <maqingyuan>

  • 相关阅读:
    HDU 1058 Humble Numbers
    HDU 1421 搬寝室
    HDU 1176 免费馅饼
    七种排序算法的实现和总结
    算法纲要
    UVa401 回文词
    UVa 10361 Automatic Poetry
    UVa 537 Artificial Intelligence?
    UVa 409 Excuses, Excuses!
    UVa 10878 Decode the tape
  • 原文地址:https://www.cnblogs.com/maqingyuan/p/8820641.html
Copyright © 2011-2022 走看看