zoukankan      html  css  js  c++  java
  • 利用arguments对象在javaScript中实现重载(overload)

    一些概念:

    重载(overload):
    什么是: 相同函数名,不同参数列表的多个函数,在调用时,可根据传入参数的不同,自动选择对应的函数调用!
    为什么: 减轻调用者的负担,一个函数名,可执行多种操作
    何时: 一项任务,根据不同的参数,执行不同的操作流程时
    如何: js语法不支持重载效果
    变通: 所有函数对象内,都自动内建了一个

    其功能实现情况如下:

    function pay(){
      console.log("微信支付") ;
    }
    function pay(num){
      console.log("现金支付") ;
    }
    function pay(card,pwd){
      console.log("刷卡支付") ;
    }
    
    //    以下是理想中的重载实现效果  
    pay()  //“微信支付”
    pay(500) //"现金支付"
    pay("xxxxxxxxxxxxx","546464") //刷卡支付
    
    //    而由于 javaScript 中的 声明提前 特性 将导致实际输出以下结果
    pay()  //刷卡支付
    pay(500) //刷卡支付
    pay("xxxxxxxxxxxxx","546464") //刷卡支付
    

      

    因此 我们需要 arguments 对象在javaScript中来模拟重载效果

    概念二:

    所有函数对象内,都自动内建了一个arguments对象
    arguments对象:
    专门保存传入函数的所有参数值的类数组对象
    类数组对象: (object like array)
    vs 数组: 相同: 下标, length, for遍历
    不同: 类数组对象是Object,不是Array,无法使用Array的API
    数组是Array类型,可以使用数组类型所有的API

    由此引申出的解决方案如下:

    function pay(){
           if(arguments[0]==null){
               console.log("微信支付");
           }else if(typeof (arguments[0])=="number"){
               console.log("现金支付,收您"+arguments[0]+"元");
           }else{
               console.log("刷卡支付,您的卡号"+arguments[0]+"扣款成功");
           }
        }
        pay(); //微信支付
        pay(500); //现金支付,收您500元
        pay("14564645646"); //刷卡支付,您的卡号14564645646扣款成功
    

      当然 arguments 对象的使用方法远远不止这一种,这里只是简单的介绍。

  • 相关阅读:
    CSS3 -- 透明色(rgba)
    CSS3 -- 多背景(backgrounds)
    CSS3 -- 背景原点(background-origin)
    CSS3 -- 背景裁剪(background-clip)
    CSS3 -- 背景尺寸(background-size)
    CSS3 -- 图片边框(border-image)
    CSS3 -- 边框颜色(border-color)
    CSS3 -- 盒模型(box-sizing)
    CSS -- 字体单位(px、em、rem)
    课程总结
  • 原文地址:https://www.cnblogs.com/sunyaaa/p/6850417.html
Copyright © 2011-2022 走看看