zoukankan      html  css  js  c++  java
  • 函数内部的两个特殊的对象:arguments和this

    arguments是一个类数组对象,包含着传入函数中的所有参数

    在arguments中还存在着一个callee属性,该属性是一个指针,指向拥有这个arguments对象的函数。

    下面是一个阶乘函数

     function factorial(num){
                if(num<=1){
                    return 1;
                }else{
                    return num*factorial(num-1);
                }
            }

    但是这个函数的执行与函数名紧紧耦合在一起

    <!DOCTYPE html>
    <html>
    <head>
        <title>Add Example 1</title>
    </head>
    <body>
        <script type="text/javascript">
            function factorial(num){
                if(num<=1){
                    return 1;
                }else{
                    return num*factorial(num-1);
                }
            }
    
            var trueFactorial=factorial;
            factorial=function(){return 0};
            alert(trueFactorial(5)); //0
           
        </script>
    </body>
    </html>

    使用arguments.callee可以消除这个麻烦

    <!DOCTYPE html>
    <html>
    <head>
        <title>Add Example 1</title>
    </head>
    <body>
        <script type="text/javascript">
            function factorial(num){
                if(num<=1){
                    return 1;
                }else{
                    return num*arguments.callee(num-1);
                }
            }
    
            var trueFactorial=factorial;
            factorial=function(){return 0};
            alert(trueFactorial(5)); //120
           
        </script>
    </body>
    </html>

    函数内部的另一个特殊的对象是this,其行为与Java和C#中的this大致类似

    换句话说:this引用的是函数据以执行的环境对象——或者也可以说是this值(当在网页的全局作用域中调用函数时,this对象引用的就是window)。

    看下面的例子

    <!DOCTYPE html>
    <html>
    <head>
        <title>Add Example 1</title>
    </head>
    <body>
        <script type="text/javascript">
           window.color="red";
           var o={color:"blue"};
           function sayColor(){
               alert(this.color);
           }
           sayColor();  //"red"
           o.sayColor=sayColor;
           o.sayColor(); //"blue"  
        </script>
    </body>
    </html>

    caller属性中保存着调用当前函数的函数的引用

    如果是全局作用域中调用当前函数,它的值为null;

    <!DOCTYPE html>
    <html>
    <head>
        <title>Add Example 1</title>
    </head>
    <body>
        <script type="text/javascript">
           function outer(){
               alert(outer.caller);     //null
               inner();
           }
           function inner(){
               alert(inner.caller);      
           }
           outer();
        </script>
    </body>
    </html>

    第一个警告框中显示null,因为outer方法是在全局作用域调用的

    第二个警告框中显示outer()函数的源代码。因为outer()调用了inner(),所以inner.caller就指向outer()。为了实现更加宽松的耦合,也可以通过arguments.callee.caller来访问相同的信息。

    <!DOCTYPE html>
    <html>
    <head>
        <title>Add Example 1</title>
    </head>
    <body>
        <script type="text/javascript">
           function outer(){
               alert(arguments.callee);      //outer的源代码
               alert(arguments.callee.caller);    //null
               inner();
           }
           function inner(){
                alert(arguments.callee);     //inner的源代码
               alert(arguments.callee.caller);    //outer的源代码
           }
           outer();
        </script>
    </body>
    </html>
  • 相关阅读:
    工厂模式之数据工厂
    面向过程的命令模式
    DLL共享主窗口的ADOCONNECTION
    插件框架
    人生哲理
    字符串函数大全
    汉化DBNavigator
    类继承复用之适配器模式
    Bootstraptagsinput标系统使用心得
    bootstrapdatepicker使用
  • 原文地址:https://www.cnblogs.com/jcbo/p/6744114.html
Copyright © 2011-2022 走看看