您的位置:首页 > Web前端 > JavaScript

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

2017-04-30 01:11 253 查看

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]+" ");
}

}
</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>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: