Web_java script基本使用C_函数

函数的基本使用
函数：有时候被称为方法，封装一段代码，能够反复使用。
调用函数：就是执行函数里面代码。
函数就是把一段代码用大括号包起来，然后起个名，然后反复使用。
优点：提高代码复用率，什么时候调用时候时候执行。

格式：
function 函数名(){
   函数体代码；
}

调用函数：
函数名();
调用函数就是为了执行里面的代码。

函数的参数使用
有时候方法里面有一些数据，需要调用者，传入进行使用。
这时需用到，函数的参数。

格式：
function 函数名(参数1，参数2，参数3){
   函数体代码（可以使用参数，作为变量使用）；
}

函数名(实参1，实参2，实参3)；

定义函数时：函数的（）里，写形式参数。多个形参用“，”隔开。
调用函数时：函数名（）里，传入实际参数。相当于 形参的值=传入的实参。

函数的参数只能在当前函数里面使用，函数外无法使用任何函数里的参数。
参数就是一个变量，变量的值由传入的实参决定。

function f(a，b){
//a,b是形参，占位用，函数定义时形参无值。
  console.log(a+b);
}
var x=3;
var y=5;
f(x,y);//x,y 实参，有具体值，会把x，y复制一份给函数内部的a和b.

js中，函数的形参和实参可不一致，结果不同
1.形参<实参
多余的实参不予理会
2.形参>实参
多余的形参，值为undefined。
3.形参=实参
正常使用

在Java语言中，有函数的重载
多个方法，方法名相同，但形参不同
例如：

public void show（int a,string s）{}
public void show（int a）{}

以上代码在java中可实现，但js中函数不能重名，否则覆盖，跟参数无关。

function f(a,b){
   console.log("我是函数f，2个参数的："+a+b)；
}
function f(a,b,c){
  console.log("我是函数f，3个参数的："+a+b+c);
}

打印提示 1.3.undefined
所以函数不能重名。

函数的返回值使用：
function f(a,b){
console.log(a+b);
return a+b;
}
接收返回值 var str=f();
观察
a+b虽然计算出结果，但函数外无法拿到结果，也就无法进行下一步计算，所以我们如果函数外部想使用这个结果，需要函数提供一个返回值给我们使用。
尤其是函数内部包含计算，那么计算后结果最好返回给函数外部进行使用。

返回值的使用：
在函数的最后一行，用return 结果；来给函数的调用者返回一个结果使用。

函数调用者如何接收返回值：
var 变量=函数名（）；
等号前是 接收返回结果 = 等号后是 调用方法返回一个结果
var str= f()
console.log(str);打印结果

函数体代码里有return，那么表示当前函数执行结束。
所以return后面出现任何代码，都不在执行。

如果函数内部没有声明return，返回一个结果。
那么外部调用者接收的结果是undefined。

function show(){
console.log("我是shou方法我执行了")；
}
var result=show();
console.log(result);
//控制台："我是show方法，我执行了"
          undefined

如果函数内部使用return声明了，但后面没任何结果
接收到的值是：undefined，此时return存在的意义在于 结束该方法。

function show(){
   console.log("执行");
   ruturn；
}
var result=show();
console.log(result);

fuuction f(){
	console.log("执行")；
	var a=5;
	if(a==5){
		return;//单纯结束方法
	}
	console.log("不是5啊..."；
}
show();
//打印台："执行"

终止循环：break；终止函数：return

alert prompt confirm返回值问题

alert("我是普通消息框");
var result=alert("消息")；
console.log(result);
//undefined

var result=confirm("选择对话框");
console.log(result);
返回值：布尔值 确定：true 取消：false

var password=prompt("输入框");
console.log(password);
输入内容      确定：返回值 为 输入的内容
没输入内容  确定：返回值 为 “”
                    取消：返回值 为  null

函数的两种定义方式
1.函数模式
function 函数名(){}

2.字面量定义方式
var 函数名=function(){}
区别：
函数模式定义函数，可提前调用
字面量定义函数方式，在函数创建代码后调用，无法提前调用
相同
都是调用一个函数
都是起个名字
都是调用函数时，执行函数体代码。

函数名，函数体，函数加载

1. 直接打印函数名，把函数代码整个以字符串形式打印出来。

function f(){
    alert("啊哈哈");
}
console.log(show)
控制台显示：
f f(){
	alert("啊哈哈");
}

2. 执行函数，等于执行函数的代码并且返回一个返回值。
3. 调用函数中如果包含函数，那么先执行里面，在执行外面。

变量作用域
作用域：指当前起作用的范围
变量作用域：指变量能够生效或者起作用的范围。

在js中变量的作用域分两种：

1. 全局作用域：
   在函数外，script标签内，定义的变量是全局变量，任意位置均可使用。
2. 局部作用域：
   在函数内声明的变量是局部变量，只在函数内使用。
   注意：形参也是局部变量

提示

1. 函数内部可以访问到该函数所属的外部作用域的变量。
2. 不使用var声明的变量是全局变量，不推荐（隐士全局变量）
3. 变量退出作用域会销毁，全局变量关闭网页或浏览器才会销毁。

变量提升

1. 在预解析阶段用var声明的变量，会被提升。
2. 会被提升到当前作用域的第一行。
3. 但只会提升变量名，不会提升变量值。

变量提升的注意：

1. 想要知道提升，要知道js运行虽然是一行一行执行，执行到哪就解析到哪。
2. 但js有预解析阶段，页面加载时，会把var和带function关键字的变量，先进行预解析。
3. 预解析就是提升。
4. 变量提升只能提升到当前作用域的第一行。

函数提升

1. 函数提升也会提升到当前作用域第一行。
2. 函数提升时，提升整个函数。
3. 只有函数模式定义的函数才会被整个提升。

函数提升的注意

1. 函数不调用就不执行。
2. 函数名等于整个函数。
3. 加载函数的时候，只加载函数名，不加载函数体（调用才加载函数体）。
4. 参数相当于局部变量。
5. 就近原则使用变量，自己有用自己的。
6. 两个平级的函数中 的变量，不会互相影响（可以使用相同的形参名）。

function demo(){
alert("我是demo函数")；
}
//讲demo函数赋给aa,那么aa就是demo函数，所以aa就是函数。

var aa=demo;//将整个函数交给aa
var  bb=demo();//调用demo函数，并取得返回值给bb
aa();//调用aa函数

函数高级之匿名函数的使用
匿名函数：没有名字的函数 只能使用一次

var demo=function (){
       console.log("我是demo函数");
}
function show(aa){
        console.log(aa);
}
show(demo)//相当于把demo整个函数传入show方法
show(function(){console.log("我是demo函数")
});

匿名函数的使用场景
1.变量式声明函数
var demo=function(){}
var show=function(){}
2.定时器里面使用
setInterval(function(){},1000)
3.IIFE(立即执行函数)----高级部分
(function(){}());
4.匿名函数作为参数（回调函数）
show(function(){});
5.绑定事件使用
box.,οnclick=function(){}

函数高级之函数是一种数据类型
函数是一种数据类型 function类型

function show(){
console.log("我是show函数");
}
//    调用函数并取得返回值
console.log(typeof show);//function

var demo=function(){}

函数高级之回调函数
函数作为参数使用时：就是回调函数的使用方式
或者：回调函数，参数变量callback，函数作为参数使用时，是回调函数使用方式。

function show(callback){
	console.log("我是show函数，下面代码是我调用参数这个函数使用")
	callback();
}
show(function(){
	console.log("我是匿名函数，作为参数传入show方法，当做回调函数使用");
})

function show(callback){
//把形参当做函数处理        
	console.log("我是show方法,我执行了,我即将调用参数的传入进来的函数");
//一旦调用者传入函数 那么相当于
	/!* var callback=function (){
		console.log("调用show函数的这个人 去定义callback函数的代码");
        }*!/
//此处是函数调用
	callback();     
}

  //如果参数要求传入一个函数 那么不止可以传入一个匿名函数  还可以传入一个函数名
    //因为函数名就等于整个函数
show(function (){
	console.log("调用show函数的这个人 去定义callback函数的代码");

});

function demo(){
	console.log("我是有名字的函数");
   }
//    demo就是整个函数
   show(demo);
// 函数内部相当于 var callback=demo=function(){}

function plus(a,b) {return a+b;}
function jian(a,b){return a-b;}
function cheng(a,b){return a*b;}
function chu(a,b){return a/b;}
//用回调函数解决 刚才计算器字符串规则的弊端
function  jisuan(a,b,callback){
	//var callback=jian;
	return callback(a,b);//此处是函数调用
}
console.log( jisuan(11,5,jian));
console.log( jisuan(11,5,plus));
console.log( jisuan(11,5,cheng));
console.log( jisuan(11,5,chu));
console.log( );
//还可以自己定义计算的规则
jisuan(11,5, function (a,b){
	return a%b;
})
//总结: 
回调函数作为规则使用,比原来的字符串清晰明了,方便后期维护.
而且还可以自定义,计算规则的函数,程序更有灵活性.

函数高级之递归
函数自己调用自己
如果直接调用是报错，所以递归不可少的是结束条件。

function show(){
	show();
}
show();  

var i=0;
function show(){
	i++;
	console.log("当前是:"+i);
	if(i<5){//递归的结束条件
		show();
	}
}
show();

var num=0；
function show(){
	console.log("我是show方法:"+num);
	num++;
	if(num<3){
		show();
	}
	console.log("我是show方法结束："+num);
}
show();
递归分解：先调用结束,再往后执行
	控制台：
		我是show方法0
		我是show方法1
		我是show方法2
		我是show方法结束：3
		我是show方法结束：3
		我是show方法结束：3
var num=0;
show1();
console.log("哈哈");
function show1() {
	console.log("我是show方法开始:"+num);
	num++;//1
	if(num<3){show2();}
	console.log("我是show方法结束:"+num);
}
function show2() {
	console.log("我是show方法开始:"+num);
	num++;//2
	if(num<3){show3();}
	console.log("我是show方法结束:"+num);
}
function show3() {
	console.log("我是show方法开始:"+num);
	num++;//3
	console.log("我是show方法结束:"+num);
}