JavaScript语言基础---(五)函数

最新推荐文章于 2023-01-20 14:50:21 发布

罗隽_jerChuan

最新推荐文章于 2023-01-20 14:50:21 发布

阅读量343

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.csdn.net/qq_31678809/article/details/70991801

版权

javascript 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

js函数的定义格式：

        function  函数名(形参列表){
            执行语句；
            [return 返回值；]
        }

写两个方法：第一个，输出Hello Function。第二个进行加法运算

<script type="text/javascript">

           function hello(){
              alert("Hello Function....");
           }
           //hello();

           function sum(a,b){
             return a+b;
           }
           //sum(1,5);

           function fun(){
              var x = sum(100,200);
              alert(x);
           }

        </script>

在html代码中调用方法用”方法名();”

<input type="button" onclick="hello();" value="函数1"> <br/>
<input type="button" onclick="fun();" value="函数2"> <br/>

以下演示函数的若干细节

1. 函数其实是一个Function对象，函数名即是对象名

<script type="text/javascript">
           //1有关函数名及内存模型的细节
           function getSum(){
              return 10;
           }
           function demo(){
              var x = getSum();
              alert(x);

              var y = getSum; //函数其实是一个Function对象，函数名即是对象名，本句相当于是引用赋值---y和getSum指向同一个Function对象
              alert(y); //相当于调用 : y.toString(),输出整数函数的特征字符串---函数的定义代码
              alert( y() ); //输出:10 ---调用引用y所指向的那个Function对象对应的函数代码
           }
        </script>

2有关函数书写位置的细节

为了我们以为写的所有js函数在页面都能被认识，通常把这些js代码写在中，然后在页面元素事件中调用，此时部分早就解析完了。

<script type="text/javascript">
           //2有关函数书写位置的细节
           function demo2(){
              show(1,2);
           }
           //demo2();//☆WA:不能执行，因为浏览器在解析当前<script>标记时，还没有加载下一个<script>标记，因此不认识show(a,b)这个函数
           //☆如果在上面按钮"函数的细节演示2"的单击事件中调用demo2()，则可以，因为事件发生时，浏览器已经把整个页面都解析完(显示完成)。
           //☆综上，为了我们以为写的所有js函数在页面都能被认识，通常把这些js代码写在<head>中，然后在页面元素事件中调用，此时<head>部分早就解析完了。
        </script>

        <script type="text/javascript">
           function show(a,b){ //这里的a,b不是用来识别函数用的，而且让js帮忙把前两个实参装配到这个两个变量，以便于使用
              alert(a+","+b);

              //有关函数参数的细节说明：js在内部是用一个名为arguments的数组去接收实参的
              alert("arguments.length:"+arguments.length);
              for(var i=0;i<arguments.length;i++){
                document.write(arguments[i]+"&nbsp;");
              }

           }
        </script>

3有关函数参数的细节: js中的函数不存在重载，参数根据调用时的实参进行自动装配—给了就赋值，没给就是undefined,多给了没接住js中参数跟函数的识别没有关系，只以函数名识别，而且函数名实际上是引用变量，和函数名捆绑的引用变量指的是同一个函数

<script type="text/javascript">
              show(1,2);
              show(1,2,4);
              show(1);
              show();
              show(3,5,"ab",true,8);//这些写法都是可以的
           }
           </script>

js动态函数的定义格式：

var 函数名 = new Function(形参列表,函数体描述); //形参列表和函数体描述必须都以字符串的形式给出

<script type="text/javascript">
            //var add= new Function("a","b","var s=0; s=a+b; return s;");//参数列表分开写
            var add= new Function("a,b","var s=0; s=a+b; return s;");//参数列表合用一个字符串参数
            //alert( add(3,5) );
        </script>

动态函数解耦用法演示—类似于Java中的类反射

函数参数列表:<input type="text" name="param"> 函数体描述:<input type="text" name="desc"> <input type="button" value="执行函数" onclick="aa();"> 
<script type="text/javascript">
          function aa(){
               var param = document.getElementsByName("param")[0].value;
               var desc = document.getElementsByName("desc")[0].value;
               var f= new Function(param,desc);//参数列表合用一个字符串参数
               alert( f(3,5) );
          }
        </script>

罗隽_jerChuan

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript语言基础---(五)函数

js函数的定义格式： function 函数名(形参列表){ 执行语句； [return 返回值；] } 写两个方法：第一个，输出Hello Function。第二个进行加法运算<script type="text/javascript"> function hello(){
复制链接

扫一扫

专栏目录