一、JS函数详解
- 普通函数
语法格式:
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或者某一个父级标签下面去获取