zoukankan      html  css  js  c++  java
  • javascript函数没有重载测试

    今天继续学习javascript系列教程,虽然是基础,但我觉得还是有必要用心来学习的,不要怕难,不用怕忘记,不要怕学不会。哪个高手不是从零开始的,我要坚定自己的学习信心,并且认真的走下去。虽然路途艰辛,但总会在尽头品尝到芬芳的味道。

    函数是定义一次但可以调用或执行任意多次的一段js代码。函数有时会有参数,即函数被调用时指定了值的局部变量。函数常常使用这些参数来计算一个返回值,这个值也成为了函数调用表达式的值。

     代码如下 复制代码

    function box(){

    alert("年龄");

    }

    function box(name,age){

    return name+age;

    }

    alert(box('caibaojian',24)); //www.111cn.net

    tip:当函数遇到第一个return,就会终止函数往下执行。

    三:argument对象 http://www.111cn.net/wy/js-ajax/57472.htm

    实际上,函数体内可以通过argument对象来接收传递进来的参数。

     代码如下 复制代码


    function box(){

    return arguments[0] + '|'+arguments[1]; //得到每次参数的值

    }

    alert(box('caibaojian',24));

    arguments对象的length属性可以得到参数的数量。

    function box(){

    return arguments.length;

    }

    alert(box(1,2,3,4,5)); 5

    javascript函数没有重载功能

     代码如下 复制代码

    function box(num,a){

    return num+a;//www.111cn.net

    }

    function box(num){

    return num;

    }

    alert(box(5,11)); 50 重载就是根据参数,选择相同函数而参数不同的函数。

    Javascript只认最后一个重名函数,根据顺序。


    但是javascript却可以通过自身属性去模拟函数重载。

    书上常见的比较无意义的例子,比如一个计算器函数,如果参数为两个数字,就执行加法运算。如果参数为三个数字,就执行乘法运算

    这个函数大家最容易想到的实现就是

     代码如下 复制代码


    function calculate() {
        if (arguments.length == 2) {
            return arguments[0] + arguments[1];
        }
        if (arguments.length == 3) {
            return arguments[0] * arguments[1] * arguments[2];
        }
    }

    alert(calculate(1, 3))
    这个函数看起来没什么不好,但随着需求的增多,if分支就会越来越庞大,而且对应的模式也越来越难看。虽然if对于语言来说没啥不好。但我们可以考虑使用另一个策略来实现这个需求。

    这就是一个新的函数重载模式。代码如下

     代码如下 复制代码


    var map = function (arr, callback, pThis) {
        var len = arr.length;
        var rlt = new Array(len);
        for (var i = 0; i < len; i++) {
            if (i in arr) rlt[i] = callback.call(pThis, arr[i], i, arr);
        }
        return rlt;
    }
    /**
     * 函数参数重载方法 overload,对函数参数进行模式匹配。默认的dispatcher支持*和...以及?,"*"表示一个任意类型的参数,"..."表示多个任意类型的参数,"?"一般用在",?..."表示0个或任意多个参数
     * @method overload
     * @static
     * @optional {dispatcher} 用来匹配参数负责派发的函数
     * @param {func_maps} 根据匹配接受调用的函数列表
     * @return {function} 已重载化的函数
     */
    var FunctionH = {
        overload: function (dispatcher, func_maps) {
            if (!(dispatcher instanceof Function)) {
                func_maps = dispatcher;
                dispatcher = function (args) {
                    var ret = [];
                    return map(args, function (o) { return typeof o}).join();
                }
            }

            return function () {// 111Cn.net
                var key = dispatcher([].slice.apply(arguments));
                for (var i in func_maps) {
                    var pattern  = new RegExp("^" + i.replace("*", "[^,]*").replace("...", ".*") + "$");
                    if (pattern.test(key)) {
                        return func_maps[i].apply(this, arguments);
                    }
                }
            }
        }
    };

    FunctionH.overload 包括两个参数,一个是负责处理匹配条件的dispatcher函数(可缺省),另一个是一组函数映射表,默认dispatcher函数是根据实际调用的参数类型生成一个字符串,例如调用的三个参数依次为10、”a”、[1,2]将生成”number,string,array”,具体实现模式匹配的时候,将根据函数映射表的每一个”key”生成一个正则表达式,用这个正则表达式匹配dispatcher函数的返回值,如果匹配,则调用这个key对应的处理函数,否则依次匹配下一个key。这样刚才那个计算机函数的需求就可以写成为

     代码如下 复制代码


    var Calculate = FunctionH.overload({
        'number,number': function () {
            return arguments[0] + arguments[1];
        },
        'number,number,number': function () {
            return arguments[0] * arguments[1] * arguments[2];
        }
    });

    alert(Calculate(1,2,3));

    顺便对于浏览器兼容的代码也可以写成下面类似的形式

     代码如下 复制代码


    var MSIE = navigator.userAgent.indexOf('MSIE') !== -1;
    var foo = FunctionH.overload(function () {
        return MSIE ? "IE" : "NotIE";
    }, {
        "IE": function () {
            alert('this is ie');
        },
        "NotIE": function () {
            alert('notie');
        }
    });

    foo();

    实现方案就是这样,对于孰优孰劣,大家可自行判断。

     
  • 相关阅读:
    《活在恩典中》第一章 人类的两难困境
    《真正的修行》把你内心的一切都呈现出来
    Mysql:Plugin:clone=mysql_clone:as of 8.0.17
    Mysql:--init-file && --init-connect
    Mysql:8.0.19:Upgrading Mysql:升级
    Android开发自定义View
    Android控制UI界面
    Android的视图(View)组件
    对Android应用签名
    Android Application的基本组件介绍
  • 原文地址:https://www.cnblogs.com/alibai/p/3572856.html
Copyright © 2011-2022 走看看