黑马程序员技术交流社区

标题: 【上海校区】Javascript详解（二） [打印本页]
作者: 偷树的光头强    时间: 2019-8-14 20:02
标题: 【上海校区】Javascript详解（二）
                                                         Javascript详解（二）
一、JS函数详解
1. 普通函数
语法格式：
function 函数名(参数列表) {
    js逻辑代码
}
函数调用：函数名(实际参数);
注意：一定要加上小括号

重点：

[JavaScript] 纯文本查看 复制代码
<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'

                </script>


[JavaScript] 纯文本查看 复制代码


//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);

                                }

                        }

                        //调用自定义函数

                        fn6(12,34);




2.匿名函数
语法格式：
function (参数列表) {
    js逻辑代码
}

注意：匿名函数没有办法直接调用
2.1使用场景
第一种：将匿名函数赋值给一个变量，使用变量调用函数。
定义函数并赋值给变量：
var fn = function(参数列表) {
    js逻辑代码
}；
调用函数：fn(实际参数);
[JavaScript] 纯文本查看 复制代码


//定义一个匿名函数

                        var fn7=function()

                        {

                                console.log('匿名函数被执行了');

                        }

                        //执行上述匿名函数

                        fn7();

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

[JavaScript] 纯文本查看 复制代码


//定义一个函数,第二个参数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);

                        });       



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







欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2