面向对象(九)扩展内置对象

2017-02-25  本文已影响18人  凸小布

title: 面向对象(九)扩展内置对象
date: # 文章生成时间,一般不改
categories: # 文章分类目录,可省略
- 面向对象
tags: # 文章标签,可省略
- 面向对象
- 基于原型面向对象的继承 # 个数不限,单个可直接跟在 tags 后面


扩展内置对象
需求:在数组上添加一个属性和方法
实现:利用对象的动态特性添加成员(属性/方法)

方式一 直接在原型上扩展内置对象

<script>
    var arr = ["1", "2", "3"];
    console.log(arr);

    Array.prototype.des = "数组的描述信息";
    Array.prototype.logDes = function(){
        console.log("数组logDes");
    }

    for(var k in arr){
        console.log(k,arr[k]);
    }
    /*
     0 1
     1 2
     2 3
     des 数组的描述信息
     logDes function (){
        console.log("数组logDes");
     }
    */
</script>

注意:在扩展内置构造函数的时候不要使用上面的方法
是因为原型对象上面的属性和方法会被所有的对象共享,可能会出现一莫名其妙的问题
如果直接在原型对象上添加属性和方法,那么很可能会被覆盖

方式二 安全的扩展内置对象

核心过程
01 提供一个构造函数(自定义)
02 设置构造函数的原型对象为内置构造函数创建出来的对象

<script>
    //Array
    function MyArray(){};
    //设置原型对象
    MyArray.prototype = new Array();
    MyArray.prototype.des = "描述信息";
    MyArray.prototype.logDes = function(){
        console.log(this.des);
    }

    //使用自己的构造函数来创建对象
    var myArr01 = new MyArray();
    var myArr02 = new MyArray();
    myArr01.push("123","abc");
    console.log(myArr01);
    console.log(myArr01.des);


    function OtherArray(){};
    OtherArray.prototype = new Array();
    OtherArray.prototype.des = "描述信息";
    OtherArray.prototype.logDes = function(){
        console.log("哈哈哈哈");
    }

    var otherArr01 = new OtherArray();
    var otherArr02 = new OtherArray();

    console.log(otherArr01.des);
    otherArr01.logDes();
</script>
上一篇下一篇

猜你喜欢

热点阅读