Javascript详解(二)

一、JS函数详解

  1. 普通函数

语法格式:
function 函数名(参数列表) {

js逻辑代码

}
函数调用:函数名(实际参数);
注意:一定要加上小括号

重点:
函数需要被调用才能执行。
js中,如果函数需要返回值我们直接return就行了。定义函数的时候不需要声明返回值的类型,因为js是弱数据类型,返回什么数据类型都是var。
在js中,如果我们需要给函数传递参数,那么我们直接写变量名就行,不需要声明传入变量的类型。
在js中,不存在函数重载的概念,如果2个函数名相同,后面出现的函数会覆蓋前面的函数。
如果函数的声明带有参数,但是调用时不带参数,函数也可以正常被调用。
如果函数声明时没有参数列表,调用的时候传入参数,函数也能照样执行。
在JS中,可以使用arguments来获取实际传入的参数。arguments是实参的参数数组。

[JavaScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<script type=”text/javascript”>

        /*
         * 函数定义格式:
         * function 函数名(参数列表)
         * {}
         */
        //定义一个函数
        function fn()
        {
            console.log(12);
        }
        //1、函数需要被调用才能执行。
        fn();
        //2、js中,如果函数需要返回值我们直接return就行了。
        //定义函数的时候不需要声明返回值的类型,因为js是弱数据类型,返回什么数据类型都是var。
        //定义一个函数
        function fn1()
        {
            return 'hello';
        }
        //调用函数
        var result=fn1();
        console.log(result);
        //3、在js中,如果我们需要给函数传递参数,那么我们直接写变量名就行,不需要声明传入变量的类型。
        //定义一个函数
        function fn2(a)
        {
            console.log(a);
        }

// fn2(3);

        fn2('hello');
        //4、在js中,不存在函数重载的概念,如果2个函数名相同,后面出现的函数会覆蓋前面的函数。
        //定义一个函数
        function fn3()
        {
            console.log('world');
        }
        function fn3()
        {
            console.log('js');
        }
        //调用函数
        fn3();//;'js'[/size][/font]

font=微软雅黑 </script>/size
font=微软雅黑

[JavaScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
/size
font=微软雅黑//5、如果函数的声明带有参数,但是调用时不带参数,函数也可以正常被调用。

        //定义带有参数的函数
        function fn4(a,b)
        {
            console.log(a+'函数被执行了'+b);
        }
        //调用函数
        //注意:如果不传递任何数据,参数显示是undefined
        fn4();//undefined函数被执行了undefined
        var c;
        console.log(c);//undefined
        //6、如果函数声明时没有参数列表,调用的时候传入参数,函数也能照样执行。
        //定义函数
        function fn5()
        {
            console.log('函数被执行了');
        }
        //调用函数
        fn5(14,23);//函数被执行了
        //7.在JS中,可以使用arguments来获取实际传入的参数。arguments是实参的参数数组。
        //定义函数
        function fn6()
        {

// console.log(arguments);

            //遍历数组
            for (var i = 0; i < arguments.length; i++) {
                console.log(arguments[i]);
            }
        }
        //调用自定义函数
        fn6(12,34);[/size][/font]

font=微软雅黑

2.匿名函数
语法格式:
function (参数列表) {

js逻辑代码

}

注意:匿名函数没有办法直接调用
2.1使用场景
第一种:将匿名函数赋值给一个变量,使用变量调用函数。
定义函数并赋值给变量:
var fn = function(参数列表) {

js逻辑代码

};
调用函数:fn(实际参数);
[JavaScript] 纯文本查看 复制代码
?
1
2
3
4
5
6
7
8
9
/size
font=微软雅黑//定义一个匿名函数

        var fn7=function()
        {
            console.log('匿名函数被执行了');
        }
        //执行上述匿名函数
        fn7();[/size][/font]

font=微软雅黑

第二种:匿名函数直接作为另一个函数的实际参数传递。
function xxx( 数字类型参数,字符串类型的参数,函数类型的参数 ) {
js逻辑代码
}
调用该函数: xxx( 100,”abc”,function(){…} );

[JavaScript] 纯文本查看 复制代码
?
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
/size
font=微软雅黑//定义一个函数,第二个参数y接收一个匿名函数

        function fn8(x,y)
        {
            //输出x和y
            console.log('x='+x);//x=100
            console.log('y='+y);//y=function(){console.log(5);}
            //调用匿名函数
            y();
        }
        //调用函数,第二个参数是匿名函数
        fn8(100,function(){
            console.log(5);
        }); [/size][/font]

font=微软雅黑

3.获取元素
方法名
描述
document.getElementById(id名称);
通过元素(标签)的id属性值获取标签对象,返回的是单个的标签对象
注意:只能从document下面去获取
document.getElementsByName(name属性名称);
通过元素(标签)的name属性值获取标签对象,返回的是标签对象的数组。
注意:只能从document下面去获取
document/parentNode.getElementsByTagName(标签名);
通过元素(标签)的名称获取标签的对象,返回的是标签对象的数组。
注意:可以从document或者某一个父级标签下面去获取
document/parentNode.getElementsByClassName(类名);
通过元素(标签)的class属性获取标签对象,返回的是标签对象的数组。
注意:可以从document或者某一个父级标签下面去获取

点赞