【笔记04】Javascript - 基本概念 - （函数）
Javascript 是底层基础，决定上层建筑，这个学不好，后面就学不明白了。
函数的诞生
先看一段代码：
if(1 > 0){
document.write("a");
document.write("b");
document.write("c");
}
if(2 > 0){
document.write("a");
document.write("b");
document.write("c");
}
if(3 > 0){
document.write("a");
document.write("b");
document.write("c");
}在实际应用中，代码要是这么写，重复率就太高了。在JS里，这种重复是不能被容忍的。
这种代码叫：偶合代码，比较低效。而我们编程，追求的是“高内聚，弱偶合”。
就是把相同的代码抽取出来，放在黑匣子里，用的时候调出来。
JS里的黑匣子就是“函数（Function）”。
示例：
function demo(){
document.write("a");
document.write("b");
document.write("c");
}
if(1 > 0){
demo(); // 调用的时候，写上函数名，加上括号，就好使了
}
if(2 > 0){
demo();
}
if(3 > 0){
demo();
}函数最基本的作用是简化代码，调用一次，执行一次。
函数跟变量类似，变量里面放的是数据，函数里面放的是很多条语句，让它执行的时候就执行。
函数能把一部分通用功能抽象出来放在一块（解偶合），用到的时候调用就行。
function demo(){
document.write("hello world");
}
demo();函数定义
函数有几种定义方法
（一）函数声明法：
function(函数名){
代码
}
函数名(); // 调用的时候
函数名和变量取名的规则一样，但在开发中，除了遵守规则，还要讲究“开发规范”。
函数名往往是具有一定字面意义的。
函数名的命名规范：小驼峰（第一个单词首字母小写，往后单词首字母大写）
function theFirstName(){
}
function hasOwnProperty(){
}
function addNum(){
}
document.write(addNum); // function addNum(){}（二）函数表达式：
命名和匿名，两种表达式定义函数，区别不大。一般都用匿名
var 变量 = function 函数名(){ // 命名函数表达式
代码
}
或
var 变量 = function(){ // 匿名函数表达式
代码
}
函数名();
示例：
var demo1 = function abc(){ // 这里的abc在调用的时候也会被忽略，所以写不写无所谓
document.write("a");
}
demo1(); // 调用时
// 或
var demo2 = function(){ // 匿名定义函数表达式
document.write("a");
}
demo2(); // 调用时
//两种区别不大，函数都有函数名
console.log(demo1.name); // abc 表达式定义时，函数名是表达式
console.log(demo2.name); // demo2 匿名定义时函数名是变量名一般说函数表达式，指的就是匿名函数表达式。
函数参数
参数在函数里是可有可否的，但参数让函数变得无比强大。
有了参数的函数，函数变成了真正的抽象规则，代入不同的数据得出不同的结果。
function sum(a,b){ // 不代表实际值，形参
var c = a + b;
document.write(c);
}
sum(1,2); // 实际执行时的参数，实参。
sum(3,4);形式参数
函数名括号中的“a,b”，不是一个数，并不代表实际值，只有传入实际值才参与计算。
所以他们叫形式参数，简称：形参；
实际参数
调用函数时的“1,2”，是一个实际的值，传入函数后参与计算，所以叫实际参数，简称：实参。
示例：
function sum(a,b){
if(a > b){
document.write(a - b);
}
if(a < b){
document.write(a + b);
}
if(a == b){
document.write(a * b);
}
}
sum(5,4); // 1
sum(5,6); // 11
sum(5,5); // 25参数位数(不限)
JS函数里的参数，不限制位数；形参比实参多可以，实参比形参多也可以。
形参的长度可以求出： 函数名.length
实参的长度可以使用：arguments 函数内的实参列表；
// 实参比形参多，可以执行
function demo(a){
document.write(a);
}
demo(11,2,4); // 11
// 形参比实参多，也可以执行
function demo(a,b,c){
// var a,b,c
// 这里的形参相当于声明了变量，多少都行，不会出错
console.log(demo.length); // 3
document.write(a);
document.write(b);
document.write(c);
}
demo(11); // 11 undefined undefined
arguments
函数有隐式的、类似数组的实参列表： arguments。有自己的长度，可遍历。
function demo(a){
// arguments -- [11,2,4]
console.log(arguments); // 11,2,4
console.log(arguments.length); // 3
// 既然arguments是数组的，就可以遍历他，显示实参
for(var i = 0; i < arguements.length; i++){
console.log(arguments[i]); // 11,2,4
}
}
demo(11,2,4);示例：形参、实参数量对比
function demo(a,b,c) {
// 主要比较：demo.length 和 arguments.length
if(demo.length > arguments.length){
console.log("形参多了");
}else if(demo.length < arguments.length){
console.log("实参多了");
}else{
console.log("参数个数相等");
}
}
demo(11,2,5,6); 示例：任意个数求和
// 使用实参列表，循环求和
function sum(){
var result = 0;
for(var i = 0; i < arguments.length; i++){
result += arguments[i];
}
console.log(result);
}
sum(1,2,3,4,5,6,7,8,9); // 45
arguments 和函数内变量有个绑定规则：
即 arguments[i] 变，变量值也变；变量值变，arguments[i]也跟着变。但是，他俩不是同一个变量，系统内部有条“映射规则”：我变你也变，你变我也跟着变。
示例：函数内修改变量值
function sum(a,b){
// arguments [1,2] 实参传入 1 和 2
// var a = 1; 相当于给a 赋值了1
a = 2; // 当我改变 a 的值后
console.log(arguments[0]); // 2 arguments[0] 也跟着变了
}
sum(1,2);当 a 变量的值变为 2 后，arguments[0] 的值也跟着变成 2。同样，修改 arguments[0] 的值，a 变量也跟着变。但是，他俩不是一个人。
示例：函数内修改实参列表值
function sum(a,b){
// arguments [1,2] 实参传入 1 和 2
// var a = 1; 相当于给a 赋值了1
arguments[0] = 3; // 修改 arguments[0] 的值为 3
console.log(a); // 3 a 变量也跟着变了
}
sum(1,2);为啥说他俩不是一个人呢？
示例：实参和形参个数不等时
当实参只传入一个值时，arguments[1]该如何变化？
function sum(a,b){
// var a,b
// 当前 arguments[1]
console.log(arguments[1]); // undefined 实参没进来，所以是 undefined
b = 2; // 给 b 赋值后
console.log(arguments[1]); // undefined 还是undefined，为何？
a = 3; // 给 a 赋值后
console.log(arguments[0]); // 3 跟着变了
}
sum(1);实参列表的值，在出生的时候，有几个就是几个。即使后面让 b = 2，也不加了，因为他就没有。
实参和形参个数不等时：能对映上的变量映射规则存在，不能对应上的变量映射规则就不存在了。
所以：上例中 a 变，arguments[0]也变；b 变，arguments[1]就不变了。
函数返回值 return
return 的作用，即可以终止函数，又可以返回值。
终止函数
函数必须识别一个叫 return 的语句，程序才能终止。
咱自己要是没写 return ，函数会给隐式的加一个 return 来终止函数。
这跟咱自己在加了一个 return 效果一样。
function sum(a,b){
console.log("hello "); // hello
console.log("world"); // world
// return 不写 return 函数也能终止，是因为函数隐式的加了一个 return
}
sum(1);为了验证这个效果，做个实验，修改一下，上面那段代码：
function sum(a,b){
console.log("hello "); // hello
return; // 人为的 return
console.log("world"); // 函数终止了，这一句就不执行了
}
sum(1);返回值
return 可以将结果返回到函数外部。
示例：系统自带的函数
var num = Number("123"); // 123 这就是Number函数返回的值咱自己写的函数，也能返回值。
示例：自己写个函数
function myNumber(target){
return Number(target); // 自己写的函数也调用Number
// return +target; 这个效果一样，因为 “+” 操作符里隐式调用了Number
}
var num = myNumber("123"); // 一般会把函数返回值赋值给一个变量继续使用
console.log(num + " : " + typeof(num)); // 123 : number此时的 return 即可以终止函数，也可以返回值。
练习
做几个有趣的练习
练习：写个函数，功能是告知你所选定的小动物的叫声。
function voice(animal){
switch(animal){
case "dog":
console.log("wang");
return; // break 一样的
case "cat":
console.log("miao");
return;
case "fish":
console.log("o~O~o");
return;
default:
console.log("???");
return;
}
}
voice("fish"); // o~O~o
voice("cow"); // ???练习：写一个函数，实现加法计数器。
function sum(num){
var result = 0;
for(var i = 0; i <= num; i++){
result += i;
}
return result;
}
var num = sum(9);
console.log(num); // 45练习：写一组函数，输入数字，逆转并输出汉字形式。
即要逆转，又要输出汉字