JavaScript函数

Posted 张晓NAN

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript函数相关的知识,希望对你有一定的参考价值。

 函数的定义 :

【完成某一个功能的代码段】

  1、方便维护 

  2、重复利用

  3、执行代码段

  函数的一些要求:

  function 定义某一个函数 命名最好要有语义化,
  函数名称最好是驼峰,
  严格区分大小写,
  函数名重名会产生覆盖,
  函数可以有参数也可以没有参数,
  可写一个也可写多个,写几个传几个 ,
  函数通过return返回值,如果不返回则是undefined。

 自调用函数:

  函数表达式可以 "自调用"。

  自调用表达式会自动调用。

  如果表达式后面紧跟 () ,则会自动调用。

  不能自调用声明的函数。

  通过添加括号,来说明它是一个函数表达式:

1 (function () {
2     var x = "Hello!!";      // 我将调用自己
3 })();

 回调函数:

  原理:

  我现在出发,到了通知你”
  这是一个异步的流程,“我出发”这个过程中(函数执行),“你”可以去做任何事,“到了”(函数执行完毕)“通知你”(回调)进行之后的流程

 1 <script type="text/javascript">
 2             //回调函数的例子
 3             function calc(x,y){
 4                 return x()+y();
 5             }
 6             function test1(){
 7                 return 3;
 8             }
 9             function test2(){
10                 return 5;
11             }            
12 //            alert(calc(test1,test2));
13             alert(calc(function(){return 5;},function(){return 10;}));    
14         </script>

 

  实现默认参数和可变参数:

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6     </head>
 7     <body>
 8     <script type="text/javascript">
 9     //实现默认参数的形式
10     function calc(x,y){
11         x=x||0;
12         y=y||0;
13         return x+y;
14 }
15     function calc(x,y){
16         if(x===undefined){
17             x=0;
18         }
19         y=y===undefined?0:y;
20         return x+y;
21     }
22 //    alert(calc());  
23 //    alert(calc(1,3));
24     function calc(x,y){
25         //return arguments;
26         //alert(arguments[0]);
27         //alert(arguments[1]);
28         x=arguments[0]?arguments[0]:0;
29         y=arguments[1]?arguments[1]:0;
30         return x+y;
31     }
32 //    alert(calc());
33 //    alert(calc(1,2));
34 //可变参数形式的函数
35     var sum=0;
36     function test(){
37         var paramsNum=arguments.length;//得到传入参数的个数
38         for(var i=1;i<=paramsNum;++i){
39             sum+=arguments[i];
40             //sum = sum + arguments[i];
41         }
42         return sum;
43         //document.write(sum);
44     }
45     //alert(test(1,2,3,4,5,6,123,344,43,3));
46     function test1(){
47         var paramsNum=arguments.length;
48         var max=0;
49         for(var i=0;i<=paramsNum-1;i++){
50             if(arguments[i]>max){
51                 max=arguments[i];
52             }
53         }
54         return max;
55     }
56     alert(test1(123,445643,3432,23456));
57     </script>
58 </body>
59 </html>

  全局函数:

 1     <script type="text/javascript">
 2         //全局函数的例子
 3         document.write(‘默认情况的结果<br/>‘);
 4         document.write(parseInt(‘32‘)+‘<br/>‘);
 5         document.write(parseInt(‘032‘)+‘<br/>‘);
 6         document.write(parseInt(‘0x32‘)+‘<br/>‘);
 7         document.write(parseInt(‘true‘)+‘<br/>‘);
 8         document.write(parseInt(‘3king‘)+‘<br/>‘);
 9         document.write(parseInt(‘ 5abc ‘)+‘<br/>‘);
10         document.write(parseInt(‘ 88 99 00‘)+‘<br/>‘);
11         document.write(‘<hr color="red"/>‘);
12         document.write(‘转换成二进制的结果<br/>‘);
13         document.write(parseInt(‘32‘,2)+‘<br/>‘);
14         document.write(parseInt(‘032‘,2)+‘<br/>‘);
15         document.write(parseInt(‘0x32‘,2)+‘<br/>‘);
16         document.write(‘<hr/>‘);
17         document.write(‘转换成八进制的结果<br/>‘);
18         document.write(parseInt(‘32‘,8)+‘<br/>‘);
19         document.write(parseInt(‘032‘,8)+‘<br/>‘);
20         document.write(parseInt(‘0x32‘,8)+‘<br/>‘);
21         document.write(‘<hr/>‘);
22         document.write(‘转换成八进制的结果<br/>‘);
23         document.write(parseInt(‘32‘,16)+‘<br/>‘);
24         document.write(parseInt(‘032‘,16)+‘<br/>‘);
25         document.write(parseInt(‘0x32‘,16)+‘<br/>‘);
26         //二进制转换成其他进制
27         document.write(‘<hr/>‘);
28         document.write(‘二进制转换成其他进制的结果<br/>‘);
29         document.write(parseInt(‘11001010‘,2)+‘<br/>‘);
30         document.write(parseInt(‘11001010‘,8)+‘<br/>‘);
31         document.write(parseInt(‘11001010‘,10)+‘<br/>‘);
32         document.write(parseInt(‘11001010‘,16)+‘<br/>‘);
33         document.write(parseInt(‘202‘,2)+‘<br/>‘);
34         
35         //转换成浮点型
36         document.write(‘<hr/>‘);
37         document.write(parseFloat(‘2.6‘)+‘<br/>‘);
38         document.write(parseFloat(‘323‘)+‘<br/>‘);
39         document.write(parseFloat(‘2e2‘)+‘<br/>‘);
40         document.write(parseFloat(‘123abc‘)+‘<br/>‘);
41         document.write(parseFloat(‘ 2.6 ‘)+‘<br/>‘);
42         document.write(parseFloat(‘a2.6‘)+‘<br/>‘);
43         
44         //通过isFinite()检测是否是无穷值
45         var x=123;
46         x=Infinity;
47         x=-Infinity;
48         x=0/0;
49         x=0;
50         x=false;
51 //        alert(isFinite(x));
52         x=NaN;
53         x=123;
54         x=false;
55         x=parseInt(‘king3‘);
56         alert(isNaN(x));
57     </script>

 全局变量和局部变量的区别:

        <script type="text/javascript">
            //全局变量和局部变量的区别
//            function test(){
//                var x=1;
//                alert(x);
//            }
//            test();
//            alert(x);
//            function test1(){
//                y=5;
//                alert(y);
//            }
            //test1();
            //alert(y);
        var x=1,y=2;
        function calc(x,y){    
            document.write(‘a的值为‘+a+‘<br/>‘);//undefined
            document.write(‘函数体内x的值为:‘+x+‘<br/>‘);//1
            document.write(‘函数体内y的值为:‘+y+‘<br/>‘);//2
            var x=0,y=6;
            z=x+y;
            x=x+y;
            var a=198;
            document.write(‘a的值为:‘+a+‘<br/>‘);//198
            document.write(‘x的值为:‘+x+‘<br/>‘);//6
            return z;
        }
//        alert(calc(1,2));//6
//        alert(x+‘-‘+y+‘-‘+z);//12u    126
        //var a=1,b=2;
        function test1(){
            var a=5,b=10;
            return a+b;

        }
        function test2(){
            var a=11,b=22;
            return a+b;
        }
        alert(test1()+test2());
        /*alert(test2());
        alert(a+‘--‘+b);*/
            
        </script>

 

 函数这块总结可能不够细致,如果有更好的希望一起交流哦~~~~~








以上是关于JavaScript函数的主要内容,如果未能解决你的问题,请参考以下文章

10个JavaScript代码片段,使你更加容易前端开发。

10个JavaScript代码片段,使你更加容易前端开发。

jQ选择器学习片段(JavaScript 部分对应)

几个关于js数组方法reduce的经典片段

VSCode自定义代码片段12——JavaScript的Promise对象

VSCode自定义代码片段12——JavaScript的Promise对象