1. 函数的概念及作用
函数可以封装任意多条语句， 而且可以在任何地方、任何时候调用执行。
函数实际上是对象。每个函数都是 Function 类型的实例对象，而且都与其他引用类型一样具有属性和方法。由于函数是对象，因此函数名实际上也是一个指向函数对象的指针（函数名等于函数体）。
（1）对象=属性+方法(主动，被动)
document.write(window.alert);
//输出方法名称。 function alert() { [native code] }
（2）函数：function
函数很重要：函数是生产方法的，功能体，反复使用。
函数是对象，也是对象的构造器。
（3）函数声明的基本结构
function 函数名(){ 调用函数时执行的代码块 }
如果只是声明了，不调用，可以当函数不存在。
调用函数：函数名()
如何获取body: document.body
innerHTML:读写元素对象里面的内容，包括标签。
读：读取内容
写：更改内容
innerHTML读取：
alert(document.getElementById('ID名').innerHTML)
alert(document.body.innerHTML);//读取body标签里面的内容。因为body在整个HTML文档中是惟一的，所以可以直接这么书写,其他标签不可以。
<body>
<script>
//读取元素对象里的内容，包括标签
alert(document.body.innerHTML)
</script>
</body>
浏览器展示：
读取body内的某个标签的内容：要注意因为某个标签不一定是惟一的，那么直接按照body的写法是错误的（ alert(document.p.innerHTML)），在浏览器不可能读出来，正确写法是给需要读取的标签，设ID名，然后利用getElementById(‘ID名’)读取该标签的内容，例如：获取p标签
<body>
<p id="p1">你好！</p>
<script>
//读取元素对象里的内容，包括标签
alert(document.getElementById('p1').innerHTML)
</script>
</body>
浏览器效果
innerHTML写入：document.getElementById(‘ID名’).innerHTML=‘需要写入的内容’;
例：给body的p标签写入内容
浏览器效果：
var str = '<table border="1">';
for (var i = 1; i <= 5; i++) {
str += '<tr>';
for (var j = 1; j <= 5; j++) {
str += '<td>11111</td>';
}
str += '</tr>';
}
str += '</table>';（虽然写出了表格，但是没有写在浏览器输出的代码，所以在浏览器中不会显示所写的表格）
document.body.innerHTML = str;（读出并书写在浏览器中）
document.body.innerHTML += 123;（在上一行内容的基础上拼接上123）
document.body.innerHTML += 456;（在上一行内容的基础上拼接上456）
//浏览器一次性显示上述三行代码的最终结果，不会执行一条代码显示一个结果
alert(document.body.innerHTML = str)（读出显示在alert信息框中，
只有纯粹的代码）
alert(document.body.innerHTML += 123);（在上一行内容的基础上拼接上123，
只不过按照程序执行顺序，先显示上一行结果，点击第二次才会显示拼接一条后的结果，跟alert有关）
2.函数的创建（声明式和赋值式）
ECMAScript 中的函数使用 function 关键字来声明，后跟一组参数以及函数体。
声明式：普通函数
function 函数名(){
调用函数执行的代码块
}
注()放的是参数
函数定义及调用：
例：
function fn() {
alert('123')
}
alert(fn)
浏览器效果：函数名等于函数体，故直接显示了整个函数体
赋值式：函数表达式:函数赋值给变量（匿名函数、自执行函数、事件处理函数）
赋值式和声明式两者的区别：变量前置访问的问题。
赋值式（函数赋值给变量）、自执行函数、事件处理函数都是匿名函数
（1）赋值式函数：函数赋值给变量，函数名就是被赋值的那个变量
创建：
var fn1=function(){
alert(456);
}
调用：函数名+括号
写在该函数体代码后面，fn1() ,能正常调用，显示结果；
但是写在该函数体代码前面，fn1（）就不能正常调用，会报错：fn1 is not a function，这是变量的特殊性性和程序的执行顺序导致的，要是在定义变量的代码前面输出该变量，那么会提示undefined，此处道理一样，提前调用赋值式函数，会报错该函数不是一个函数。
（2）自执行函数：声明和调用写在一起（只执行一次）
普通函数的定义及调用方法是：
function fn() {
alert('123')
}
fn()
因为函数名等于函数体，故第四行代码的fn函数名可以改为1~3行的函数体，故可改为
function fn() {
alert('123')
}()
但是这样写不符合语法规范，与此同时函数名fn不起作用了，故可以删除，为了符合语法规范，需要将function fn() {alert(‘123’) }变为一个整体，可以在前面加上！或者用（）将其包含起来，故可得自执行函数的创建方法
创建
(function (形参){
alert(123);
})(实参);
!function (形参){
alert(123);
}(实参);
例：
(function(a) {
alert(a);
})(3);//输出结果为3
（3）事件处理函数：将函数给事件
function a() {
alert('ok')
}
alert(a())//调用函数，先出现OK，后出现undefined，出现undefined的原因
//第二行代码后面有：return：undefined，（返回值），没有写
document.onclick = a(); //直接调用函数，不受是否点击的影响。
document.onclick=a;//将函数绑定给点击事件，点击后调用函数，
因为函数名等于函数体， 根据第八行代码，可得事件处理函数事件创建方法
创建：
document.onclick=function(){
alert('ok');
};
3.参数的声明
函数的参数包括形参和实参，形参出现在函数定义中，在整个函数体内都可以使用， 离开该函数则不能使用。而实参则出现在主调函数中，进入被调函数后，实参变量也不能使用。
//形参出现在函数定义
function fn(a,b){//形参：形式上存在 a,b var a=3,b=4;
alert(a+b);
}
//实参则出现在主调函数中
fn(3,4);//实参：实际的参数，具体的值。
function sum(a,a,b,c){//函数的形参理解成函数内部的变量。
alert(a+a+b+c);//2+2+3+4=11
}
sum(1,2,3,4);
//var=1;
//var=2;(覆盖var=1,所以a的值是2)
//var=3;
//var=4;
实参个数多余形参个数
function sum(a, b, c) {
alert(a + b + c)//输出6
}
sum(1, 2, 3, 4)(形参只设置了三个，实参设置了四个，但是没有办法全部接受，只接受1,2,3)
实参个数小于形参个数
function sum(a, b, c, d) {
alert(a + b + c + d)//输出NaN，原因是d是个变量，
//未定义的变量输出为undefined,6+undefined的输出结果是NaN
}
sum(1, 2, 3)
函数不介意传递进来多少参数，也不会因为参数不统一而错误。实际上，函数体内可以通过arguments 对象来接收传递进来的参数。
实际上，函数体内可以通过arguments 对象来接收传递进来的参数。
arguments对象:理解成实参。
arguments.length:参数的长度。
通过下标(编号)来获取实参的值。下标从0开始。放在中括号里面
arguments[i]:参数的每一个值。
注意：形参相当于定义在函数内部的变量，是形式上存在（即声明了没赋值）。而实参是具体的值，实参将值传递给形参。
函数的返回值
函数都有一条return语句，return语句导致函数停止执行，并返回它的表达式的值给调用者。 如果return语句没有相关的表达式（如果函数没有return），则返回undefined。返回值返回给调用者，虽然结果已经存在，但是不将结果打印出来（下面4,5,6行都是打印结果），那么结果无法显示。
结果返回给调用者，再函数外打印：
function sum(a, b) {
return a + b;
}
alert(sum(1, 3))//4
document.write(sum(1, 3))//4
console.log(sum(1, 3))//4
函数没有return：
function sum(a, b) {
alert(a + b);
}
alert(sum(1, 3))//先输出4，再输出undefined，原因是函数没有return，就会返回undefined
return语句导致函数停止执行：
function fn(){
return 'hello';//导致函数停止执行
alert('hehe');//不会执行
}
扫一扫
1751
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
