JS函数
函数介绍
1.JS函数的概念
函数就是把特定功能的代码抽取出来，使之成为程序中的一个独立实体。
2.函数的作用
正如函数的概念，我们可以根据需要，将特定的功能用函数来包裹(封装)
3.使用函数的好处
1.函数可以在同一个程序或其他程序中多次重复使用(通过函数名调用)
2.使程序变得更简短而清晰，提高可读性
3.有利于程序维护
函数的分类
函数可以分类为:系统函数 内置函数 和 自定义函数
系统函数/内置函数:
是官方提供好的函数，可以直接使用
如: alert() isNaN() console.log() document.write() Boolean() Math.pow()等
自定义函数:
是用户自己定义的函数，用户可以根据实际需求，对特定的功能使用函数来封装
函数的定义和调用
函数的简单定义
定义函数的语法格式
function 函数名(){
代码块
}
注意: 1.必须使用function关键字，且为小写，函数名可以自己定
2.函数名的命名规则和变量名一致
1 只能以数字，字母，下划线，$组成
2 不能以数字开头
3 不能是保留字，关键字
4 严格区分大小写
5 遵循驼峰命名法
6 语义化
3.形参num1，num2：形式参数，只是一个占位
1 默认是undefined
2 是一个局部变量
4.return关键字 返回结果 并终止函数
1 关键字下一行代码不会执行
2 函数不一定要有return，没有return就表示没有返回值，函数默认的返回值是undefined
5.函数名称+小括号 表示调用函数 calc()
6.实参100，200：实实在在的值，确定形参的类型
例:
function calc(num1,num2) {
var res = num1 + num2
return res
}
var sum = calc(100,200)
console.log(sum);
//函数的定义有三种写法
//写法1 普通写法，调用可以在定义的前面，后面使用
console.log(show("刘德华"));
function show(name) {
return "姓名为" + name
}
console.log("刘德华");
//写法2 匿名函数 不可以在函数的前面调用
show();//报错
var show = function(){
console.log("我是匿名函数");
}
show();
//写法3 构造函数创建函数
// new Function的最后一个参数是函数的代码体
var calc = new Function ("a","b","c","return a+b+c");
var res = calc(10,20,30)
console.log(res);
函数的定义和调用
函数的调用方式: 函数名()
如 : 调用下面的函数: printOut()；
function printOut(){
document.write(“Hello World!”);
}
注意: 1, 调用函数后会执行函数内部的代码块;
2, 函数在不调用的情况下是不会执行的, 只有调用后函数中的代码才会执行
函数的标准定义
定义函数的语法格式:
function 函数名(参数1，参数2，……)
{
执行语句;
return 返回值;
}
注意:1, 函数名后圆括号()中的参数数量不定, 也可以没有; (根据功能需要)
2, return关键字的作用是将某个值返回, 如果没有返回值则默认返回undefined;
示例: 定义一个函数sum
function sum(one, two){
var s = one + two;
return s;
}
调用上面的函数:
var result = sum(2, 8);
console.log(result);
上面代码的执行过程:
1, 先执行sum(2,8), 将2传给变量one, 将8传给变量two;
2, 函数sum内部执行one和two的相加, 然后将和返回, 返回值会赋值给result, 所以result为2和8相
加后的和: 10;
3, 最后会打印出10
函数中的arguments数组:
1 JS中函数不介意传递进来多少个参数，也不在乎传进来参数是什么数据类型，在调用函数时也未必一定要
传递指定数量的参数，原因是 ECMAScript 中的参数在内部是用一个数组(arguments)来表示的。函数接
收到的始终都是这个数组，而不关心数组中包含哪些参数（如果有参数的话）。
2 arguments可以判断参数的个数，arguments是个数组(后面会详细讲解数组)。
3 我们可以使用arguments.length来获取参数的个数
4 可以使用arguments[i] 的方式来访问数组中的第i个参数(i为自己给定的整数下标)
注意：
在传值调用的机制中只能把实参传送给形参，而不能把形参的值反向地传送给实参。因此在函数调用过程
中，当形参值发生改变，而实参中的值不会变化。
function addNum(n){
n += 5; //将形参+5, 不会改变实参
}
var a = 10;
addNum(a);
console.log(a); //10
作用域:
就是起作用的范围。或者说有效范围; 这里涉及到另外两个概念
局部变量: 定义在函数内部的变量，这个变量只能在函数内部使用，即作用域范围只是函数内部，
另外，形参也是局部变量.
全局变量: 全局变量就是定义在函数外部的变量，这个变量在任何函数中都有效，即作用域范围
是当前文件的任何地方.
注意: 在定义变量时, 如果不写关键字var也是合法的, 且是全局变量, 但是这样写不安全,
容易在其他地方被更改, 所以我们在函数中写变量要加上var
函数的嵌套:
函数的嵌套: 函数内部可以再包含其他函数;
函数之间允许相互调用，也允许向外调用, 但是不可以调用同级函数的嵌套函数;
DOM的简单操作:
1, 获取元素节点对象: document.getElementById(‘id’);
2, 获取输入框的内容: value属性
3, 点击事件: onclick
事件驱动:
因为函数不会主动执行, 只有当调用的时候才会执行函数中的代码, 在前面的dom操作示例中,我们点击
了按钮才触发函数调用
所有的函数，没有调用不会执行，那么在我们浏览器中函数调用的源头在何处，就是事件, 只有使用事件
去驱动, 函数才被调用; 如: onclick: 点击事件
DOM与事件驱动 示例
<input id="num1" value="">
<select id="opt">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
<option value="%">%</option>
</select>
<input id="num2">
<button id="btn">=</button>
<input id="num3">
<script>
//1.获取对应dom o---> object 对象
var oNum1 = document.getElementById("num1");//通过id获取
var oNum2 = document.getElementById("num2");
var oNum3 = document.getElementById("num3");
var oOpt = document.getElementById("opt");
var oBtn = document.getElementById("btn");
//1.给按钮绑定点击事件
// 事件驱动编程
// 通过事件驱动函数的执行
// 通过事件执行函数
oBtn.onclick = function () {
var n1 = oNum1.value; //取输入的值
var n2 = oNum2.value; //取输入的值
var str = oOpt.value; //取输入的值
var res = calc(n1, n2, str);
oNum3.value = res //赋值给输入框
}
function calc(num1, num2, opt) {
//判断运算符号
if (opt == "+") {
return num1 + num2
}
if (opt == "-") {
return num1 - num2
}
if (opt == "*") {
return num1 * num2
}
if (opt == "/") {
return num1 / num2
}
if (opt == "%") {
return num1 % num2
}
}
</script>
注意: document.write() 在文档页面加载完后使用会覆盖页面内容, 尽量少用
递归调用: 函数可以自己调用自己,必须要有结束条件,称为函数的递归调用;
重要性:
递归的分量，递归属于函数中比较难理解的知识，在应用开发中，虽然使用不是很频繁，但是很体现你的
功底，而且，从事IT行业开发，最好要会递归，如果说现在可以不要求灵活运用的话，以后到公司中一定
要会，如果面试中有人问你递归，说明，他对你要求挺高
递归调用的方式:
1. 首先去找临界值，即无需计算，获得的值(一般是返回该值)。
2. 找这一次和上一次的关系(一般从后往前找)
3. 假设当前函数已经可以使用，调用自身计算上一次的运行结果，再写出这次的运行结果。
