javascript代码实例教程-寄生构造函数――扩展原生数组

发布时间:2019-03-01 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-寄生构造函数――扩展原生数组脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 最近在产品研发过程中,发现需要对原生数组进行一些扩展,我们深知修改原生对象的弊端,尤其在产品化的程序中修改原生对象的原型。如果因某个实现中缺少某个方法,就在原生对象的原型中添加这个方法,那么当在另一个支持该方法的实现中运行代码时,就可能会导致命名冲突。而且,这样做也可能会意外地重写原生方法,大名鼎鼎的PRototyPE框架败因也在于此,改写了大量原生对象,当ecmascript升级时,面临着许多改写方法与原生方法重名的问题,因此要不断地更改这些原有的扩展名称,导致一系列附带问题的出现。

  工作中对于这样的问题我采用了“寄生构造函数模式”对原生数组进行了扩展,虽然这种方法大家都不怎么使用,但是处理这种类型的问题,只有这种方式才最有效。如果采用传统的组合构造函数和原型模式,无形中也就犯了在原生对象上进行扩展的毛病,修改了原生数组。

  寄生构造函数模式到底是一种什么样子的呢?

[javascript] 

VAR myArray = function () {  

            //创建一个新对象  

            var arr = [];  

            //获得某值的索引值  

            arr.indexOf = function (ITem) {  

                for (var i = 0, len = arr.length; i < len; i++) {  

                    if (arr[i] === item) {  

                        return i;  

                    }  

                }  

  

                return -1;  

            };  

            //检查某值是否在数组中  

            arr.hasItem = function (item) {  

                return arr.indexOf(item) !== -1;  

            };  

            //不允许插入数组中已有的值,这里也可以传入一个数组  

            arr.append = function (aitem) {  

                function _push(aItem) {  

                    var aExt = [];  

                    for (var i = 0, l = aItem.length; i < l; i++) {  

                        if (!arr.hasItem(aItem[i])) {  

                            arr.push(aItem[i]);  

                        } else {  

                            aExt.push(aItem[i]);  

                        }  

                    }  

  

                    if (aExt.length > 0) {  

                        alert(aExt.toString() + &#39; has IN ARRAY!');  

                        aExt = null;  

                    }  

                };  

  

                if ($.isArray(aItem)) {  

                    _push(aItem);  

                } else {  

                    _push(arguments);  

                }  

  

                return arr;  

            };  

            //移除某值,或某个数组  

            arr.remove = function (aItem) {  

                function _splice(a) {  

                    for (var i = 0, l = a.length; i < l; i++) {  

                        var item = a[i];  

                        if (arr.hasItem(item)) {  

                            return arr.splice(arr.indexOf(item), 1);  

                        }  

                    }  

                };  

  

                if ($.isArray(aItem)) {  

                    _splice(aItem);  

                } else {  

                    _splice(arguments);  

                }  

  

                return arr;  

            };  

            //清空数组  

            arr.clearAll = function () {  

                arr.length = 0;  

                return arr;  

            };  

            //在某个索引处插入某值  

            arr.insert = function (target, indexpos) {  

                var len = arguments.length;  

                if (len == 2) {  

                    var arg = arguments[0];  

  

                    if (!arr.hasItem(arg)) {  

                        arr.splice(arguments[1], 0, arg);  

                    } else {  

                        alert(arg + ' has in Array!');  

                    }  

                } else {  

                    alert('insert args count error!');  

                }  

  

                return arr;  

            };  

            //去除重复项  

            arr.removeRepeat = function () {  

                var JSON = {}, res = [], l = arr.length;  

                if (l > 0) {  

                    json[arr[0]] = true;  

                    res.push(arr[0]);  

  

                    for (var i = 1; i < l; i++) {  

                        if (!json[arr[i]]) {  

                            json[arr[i]] = true;  

                            res.push(arr[i]);  

                        }  

                    }  

                }  

  

                return res;  

            };  

  

            //返回新对象,这个新对象重写调用构造函数时返回的值this  

            return arr;  

        };  

  在这个例子中,myArray函数创建了一个新对象,并以相应的属性和方法初始化该对象,然后又返回了这个对象。除了使用new操作符并把使用的包装函数叫做构造函数之外,这个模式跟工厂模式其实是一模一样的。构造函数在不返回值的情况下,默认返回新对象实例。而通过在构造函数的末尾添加一个return语句,可以重写调用构造函数时返回的值this。

  关于寄生构造函数模式,有一点需要说明:首先,返回的对象与构造函数或者与构造函数的原型属性之间没有关系;也就是说,构造函数返回的对象与在构造函数外部创建的对象没有什么不同。为此,不能依赖instanceof操作符来确定对象类型。由于存在上述问题,所以通过这种模式创建的对象实例类型只能是object。

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-寄生构造函数――扩展原生数组全部内容,希望文章能够帮你解决javascript代码实例教程-寄生构造函数――扩展原生数组所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。