zoukankan      html  css  js  c++  java
  • JS框架设计之对象扩展一种子模块

    对象扩展

    说完了,对象的创建(框架的命名空间的创建)以及如何解决多库之间的命名空间冲突问题之后,接下来,就是要扩展我们的对象,来对框架进行扩展,我们需要一种新功能,将新添加的功能整合到我们定义的对象中去。这种类型的方法在Javascript中常被称为extend和mixin。在Javascript对象属性特性没有诞生之前,我们可以随意的添加、修改、删除其属性的,因此扩展一个对象十分的简单。一个简单的代码扩展方法如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
    <body>
    <script>
    var zc={};//需要扩展的对象
    var source={aa:1,bb:2};
    /*
    @zc 需要扩展的对象
    @source 扩展对象里面的内容
    */
    extend(zc,source);
    function extend(zc,source){
    for(var property in source)
    zc[property]=source[property];
    return zc;
    }
    alert(zc.aa);
    </script>
    </body>
    </html>


    这个方法在旧版本的IE中存在bug,因为它认为Object的原型方法就不该被遍历出来,因此for in循环是无法遍历名为valueof 和 toString的属性名的属性名,这导致后来模拟实现Object.Keys()也遇到了困难。下面这个方法主要用于获取对象的属性,给那些在(js引擎没有实现Object.Keys)的浏览器中获取对象的属性用的

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    </head>
    <body>
    <script>
    var zc={aa:1,1:'2'};
    Object.keys=Object.keys || function(_obj){
    var a=[];
    for(a[a.length] in obj)
    //在for in 循环中每遍历obj中的一个元素,都会将该元素的值赋值给in 前面的临时变量,而这个变量直接用一个aa局部变量代替
    //那么就省去了下面的赋值语句,直接达到了给a数组赋值的效果
    return a;
    }
    alert(Object.keys(zc));//输出:1,aa
    </script>
    </body>
    </html>

     mass的对象扩展方法

      var zc={};
    function extend(target,source){
        //将arguements转换成数组对象
        var args=[].slice.call(arguments); //slice如果不传递参数,则默认截取所有的参数
        var i=1;//控制用户参数传入的开始遍历的位置
        var key;
        //arguements的最后一个参数,决定是不是要对重复的参数进行复写,并规定最后一个参数只能是boolean
        var ride=typeof args[args.length-1]=="boolean"?args.pop():true;//获取最后一个参数,如果不是bool值默认为true
    
        //当传入参数只有一个时候
        if(args.length===1){
            target=!this.window?this:{};
        }
        //从第二个参数开始遍历(因为第一个参数是,要追加属性的对象),一直遍历到最后一个参数,知道source=undefined时,结束遍历
        while ((source=args[i++])){
            for(key in source)
            {
                //如果复写,或者当前属性在target对象中不存在
                if(ride || !(key in target))
                {
                    //将属性写入到对象中
                    target[key]=source[key];
                }
            }
        }
        return target;
    }
        extend(zc,{version:"1.0.0",name:"zcJsHelper"},{other:"other"},true,true);
        alert(zc.other);
  • 相关阅读:
    37 反转一个3位整数
    372 在O(1)时间复杂度删除链表节点
    174 删除链表中倒数第n个节点
    13 字符串查找
    4.Single Number(出现一次的数)
    7.斐波那契数列
    6.旋转数组的最小数字
    5.用两个栈实现队列
    垃圾收集器与内存分配策略---确定对象的存亡状态
    Java内存区域与内存溢出异常---对象的内存布局和对象的访问定位
  • 原文地址:https://www.cnblogs.com/GreenLeaves/p/6410328.html
Copyright © 2011-2022 走看看