js函数 day3

for(var sum=0,i=0;i<=100;i++){ sum+=i; }
而不能写成for(var sum=0,var i=0;i<=100;i++)

函数可以封装任意多条语句，而且可以在任何地方、任何时候调用执行。
JS中的函数也是对象但是它同时也是对象的构造器，所以JS函数可以像其它对象那样操作和传递，我们也常叫JS中的函数为函数对象。
函数是用来帮助我们封装、重用、扩展及调用代码的最方便的工具！

ECMAScript 中的函数使用 function 关键字来声明，后跟一组参数以及函数体。

普通函数声明
1. 函数表达式：函数赋值给变量（自执行函数、事件处理函数）

函数的参数包括形参和实参，参数的传递是将实参传递给形参，函数的形参相当于函数内部的局部变量
函数不介意传递进来多少参数，也不会因为参数不统一而错误。
函数体内可以通过 arguments 对象来接收传递进来的参数（实参）

函数都有一条return语句，return语句导致函数停止执行，并返回它的表达式的值给调用者。如果return语句没有相关的表达式，则返回undefined。

事件，就是文档或浏览器窗口中发生的一些特定的交互瞬间。可以使用侦听器（或处理程序）来预订事件，以便事件发生时执行相应的代码。
鼠标事件，当用户通过鼠标在页面上执行操作时触发；（焦点事件）
1. 键盘事件，当用户通过键盘在页面上执行操作时触发;

(事件处理函数）

任何程序设计语言都有作用域的概念，简单的说，作用域就是变量与函数的可访问范围，即作用域控制着变量与函数的可见性和生命周期。

全局变量：整个程序都有效，即整个代码中都可以调用。

局部变量：只对函数内部有效，即只能在本变量声明的函数内部调用。

在函数体内，局部变量的优先级高于同名的全局变量。

JS的解析过程分为两个阶段：预编译期(预处理)与执行期。

1、预编译期JS会对本代码块(script)中的所有声明的变量和函数进行处理（类似与C语言的编译），但需要注意的是此时处理函数的只是声明式函数，而且变量也只是进行了声明但未进行初始化以及赋值。

2、执行期就是在编译后的基础上开始从上到下执行脚本，遇到错误时中断。

递归函数是在一个函数通过名字调用自身情况下构成的。

编写一个函数，计算两个数字的和、差、积、商。
编写函数实现任意个数字的求和。
编写生成4位数字验证码的函数。
函数和循环结合打印九九乘法表。
利用递归求100的阶乘。
利用递归求斐波那契数列的前20项。

编写一个函数，输入n为偶数时，调用函数求1/2+1/4+1/6...+1/n,当输入
n为奇数时，调用函数求1+1/3+1/5...+1/n.
使用函数完成任意数字阶乘的计算

要求：页面输入任意数字，点击按钮后计算阶乘.

某个公司采用公用电话传递数据，数据是四位的整数，在传递过程中是加密

的，加密规则如下：每位数字都加上5,然后用除以10的余数代替该数字，

再将第一位和第四位交换，第二位和第三位交换，请编写一个函数，传入原文，

输出密文。

//1.系统默认的方法汇总:对象下面的，具有功能。

//alert()

//prompt()

//document.write()

//document.getElementById()

//Number()

//String()

//boolean()

//parseInt()

//parseFloat()

//toFixed()

//Math.pow()

//所有的方法来自于--函数。

//1.普通函数的声明/创建。(函数如果不调用，当函数不存在)

/*function a(){

函数体:封装任意多条语句

}*/

/*function a(){

alert(1);

alert(2);

}*/

//2.函数的调用。

//a();

/*function fn(){

document.write(123);

}*/

//alert(typeof fn);//function

//alert(fn);

//函数既属于对象，同时也是对象的构造器。

//函数名等同于函数体(整个函数声明的所有代码)

//3.函数的参数

//将实参的值传递给形参。

/*function fn(a){//a:形参，类似于变量，形式上存在的占位符。

alert(a);

}

fn(456);//456：实参，实际存在的值。

fn(789);*/

/*sum(1,3);//任何地方进行调用。

function sum(a,b){//形参可以定义多个，中间用逗号分隔。

alert(a+b);

}

sum(12,12);

sum(123,456);*/

//4.函数的返回值：函数一定具有返回值，如果没有显式定义，函数默认返回undefined

/*function sum(a,b){

return a+b;

}

alert(sum(100,200));*/

/*function sum(a,b){

alert(a+b);

}

alert(sum(10,20));*///30不是函数的返回值，是函数内部某条语句执行的结果。 undefined

</script>

//函数的组成：

/*function 函数名(形参){

函数体

return //函数的返回值，同时终止函数，return后面的代码不执行了

}*/

/*function fn(str){

console.log(str);

return '返回值：'+str;//函数的返回值，同时终止函数，return后面的代码不执行了

console.log('hehe');//不会执行了。

}

alert(fn('hello,javascript'));*///函数的返回值

//1.函数的参数功能是什么：扩展函数功能。

//2.函数任何地方调用。

</script>

/*var str='<table border=1>';

for(var i=1;i<=3;i++){

str+='<tr>';

for(var j=1;j<=3;j++){

str+='<td>111111</td>'

}

str+='</tr>';

}

str+='</table>';

document.write(str);

var str='<table border=1>';

for(var i=1;i<=5;i++){

str+='<tr>';

for(var j=1;j<=5;j++){

str+='<td>111111</td>'

}

str+='</tr>';

}

str+='</table>';

document.write(str);

var str='<table border=1>';

for(var i=1;i<=8;i++){

str+='<tr>';

for(var j=1;j<=8;j++){

str+='<td>111111</td>'

}

str+='</tr>';

}

str+='</table>';

document.write(str);*/

/*function createTable(a,b){

var str='<table border=1>';

for(var i=1;i<=a;i++){

str+='<tr>';

for(var j=1;j<=b;j++){

str+='<td>111111</td>'

}

str+='</tr>';

}

str+='</table>';

return str;

}*/

/*document.write(createTable(3,5));

document.write(createTable(4,8));

document.write(createTable(10,15));*/

//document.body.innerHTML=createTable(6,6);

//封装函数计算任意数字的阶乘。

/*for(var i=1,result=1;i<=5;i++){

result*=i;

}

alert(result)*/

function jc(n){

for(var i=1,result=1;i<=n;i++){

result*=i;

}

return result;

}

for(var j=1,sum=0;j<=5;j++){

sum+=jc(j);

}

alert(sum);//153=1+2+6+24+120

</script>

//1.普通函数

/*alert(fn(1,2));//3

function fn(a,b){

return a+b;

}

alert(fn(10,20));//30*/

//2.函数表达式:函数表达式赋值给变量

//alert(fn1(120,10));//fn1 is not a function 变量前置访问，输出undefined

/*var fn1=function(a,b){

return a+b;

}

alert(fn1(12,10));*///22

//3.特殊的函数表达式

/*function fn(){

alert(123);

}

fn();*/ //函数调用

//结合：自执行，自己自动执行。

//自执行函数(匿名函数)

/*(function (){//推荐的

alert(123);

})();*/

//自执行函数，利用!运算符将函数转换成表达式

/*!function (){//推荐的

alert(123);

}();*/

/*+function (){

alert(123);

}();

~function (){

alert(123);

}();*/

</script>

//对象：属性+方法(被动的/主动的)

//主动的方法

//alert();

//被动的方法：事件处理函数

//var box=document.getElementById('box');

/*function fn(){

box.style.display='none';

}*/

//主动的

//fn();

//被动的--用于事件。当把一个函数给事件，叫事件处理函数。

//box.onclick=fn; //事件处理函数

/*box.onclick=function (){//事件处理函数

box.style.display='none';

}*/

//注意，fn后面不能添加括号，添加括号代码函数已经执行了，不添加括号代码着需要我鼠标点击才执行。

/*function a(){

alert(1);

}

a();

box.onclick=a;*///此时的a函数是事件处理函数。

</script>

/*var num=10;

function fn(){

var a=100;//函数内部

alert(a);

}

fn();*/

//alert(num);

//alert(a);//a is not defined

//n函数不介意传递进来多少参数，也不会因为参数不统一而错误。

/*function sum(a,b,c,d){

return a+b+c+d;

}

alert(sum(1,2,3));//NaN*/

//函数体内可以通过 arguments 对象来接收传递进来的参数（实参）

//arguments: length属性，实参的个数。

//arguments: 利用[下标]获取实参具体的值，下标默认从0开始自动编号。

function sum(){

//alert(arguments.length);//100

//alert(arguments[0]);//1

for(var i=0,he=0;i<arguments.length;i++){//i=0-99

he+=arguments[i];

}

return he;

}

alert(sum(1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10,1,2,3,4,5,6,7,8,9,10));

</script>

padding:0px;

margin:0px;

}

#box{

width: 560px;

height: 305px;

border:1px solid #FF0000;

margin:20px auto;

position: relative;

}

#box img{

width: 560px;

height: 305px;

display: block;

}

#left,#right{

position: absolute;

color:#fff;

text-decoration: none;

font-size:100px;

top:50%;

margin-top:-50px;

}

#left{

left:20px;

}

#right{

right:20px;

}

</style>

</head>

<body>

</div>

var left=document.getElementById('left');

var right=document.getElementById('right');

var img1=document.getElementById('img1');

var num=1;

right.onclick=function(){

num++;

if(num>4){

num=1;

}

img1.src='img/'+num+'.jpg'

};

left.onclick=function(){

num--;

if(num<1){

num=4;

}

img1.src='img/'+num+'.jpg'

}

</script>

//输入一个日期，判断这个日期是这一年的第几天 2018-3-12 31+28+12=71

//年月日 2018-5-10 31+28+31+30+10

//2018-2-14 31+14=45

/*var year=prompt('请输入年份：');

var month=prompt('请输入月份：');

var day=Number(prompt('请输入日期：'));//直接累加

var result=0;//存放天数

for(var i=1;i<month;i++){

if(i==1 || i==3 || i==5 || i==7 || i==8 || i==10){

result+=31;

}else{//包含2月非闰年：28 闰年：29

result+=30;

}

if(month>2 && (year%4==0&&year%100!=0||year%400==0)){//月份大于2同时是闰年

result-=1;

}else if(month>2) {//非闰年

result-=2;

}

result+=day;

alert(result);*/

function fn(year,month,day){

/*var year=prompt('请输入年份：');

var month=prompt('请输入月份：');

var day=Number(prompt('请输入日期：'));//直接累加*/

var result=0;//存放天数

for(var i=1;i<month;i++){

if(i==1 || i==3 || i==5 || i==7 || i==8 || i==10){

result+=31;

}else{//包含2月非闰年：28 闰年：29

result+=30;

}

if(month>2 && (year%4==0&&year%100!=0||year%400==0)){//月份大于2同时是闰年

result-=1;

}else if(month>2) {//非闰年

result-=2;

}

result+=day;

return result;

}

alert(fn(2018,5,10));

alert(fn(2018,3,12));

</script>

//1.事件的类型

//鼠标事件

//onclick:鼠标单击

//onmouseover:鼠标经过

//onmouseout:鼠标移出

//onmousedown:鼠标按下

//onmouseup:鼠标抬起

//onmousemove:鼠标移动

//onfocus:得到焦点(光标) --表单

//onblur:失去焦点

//键盘事件

//onkeydown:按下按键

//onkeyup:按键抬起

//2.事件的概念：就是文档或浏览器窗口中发生的一些特定的交互瞬间。

//可以使用侦听器（或处理程序）来预订事件，以便事件发生时执行相应的代码。

var txt=document.getElementById('txt');

txt.onfocus=function(){

if(txt.value=='请输入内容'){

txt.value='';

}

txt.onblur=function(){

if(txt.value==''){

txt.value='请输入内容';

}

</script>

//问题：

//为什么变量前置访问输出undefined

//为什么函数可以任何地方进行调用。

//js预解析分为两步：1.预编译期 2.执行期

//1.预编译期：程序在浏览器执行之前要干的事情--默认完成

//首先找var 和 function

//找到var提前赋值 undefined给变量，找到函数提前将整个的函数体赋值给函数。

//如果函数和变量出现重名，函数优先。

//函数的内部同样也要做预解析。

//函数的形参就是函数的局部变量(默认有var)

//2.逐行执行：代码一行一行逐行解读，遇到错误终止。

//函数声明跳过，没有调用，当中函数不存在。

预解析时，在全局中找var和function函数，在函数中找var和函数

/*alert(a);//function a(){ alert(123) }//与解析，如果函数和变量出现重名，函数优先

var a=10;//上面a=函数体，现在把a变成变量了，所以下面的a会报错

function a(){

alert(123);

}

a();//报错*/

/*alert(a);//undefined

var a=10;

alert(a)//10*/

/*fn();//123，fn是个函数体，加上（）则是执行函数

function fn(){

alert(123);

}

fn()*///123

</script>

//任何程序设计语言都有作用域的概念，简单的说，作用域就是变量与函数的可访问范围

//即作用域控制着变量与函数的可见性和生命周期。

//全局变量：整个程序都有效，即整个代码中都可以调用。

//局部变量：只对函数内部有效，即只能在本变量声明的函数内部调用。

//在函数体内，局部变量的优先级高于同名的全局变量--作用域链

/*alert(a);//undefined

var a=10;

alert(a);//10*/

/*var a=100;//全局作用域，全局变量。

function fn(){

var a=10;//局部作用域，局部变量

}

fn();

alert(a);*///100

/*var a=1;

function fn(){

var b=1;//作用于函数内部

var a=3;//局部变量的优先级高于同名的全局变量

alert(a);

}

fn();

alert(a);//1*/

/*var num=1;

function fn(){

num=10;//改变了全局变量的值

}

fn();

alert(num);//10*/

/*function fn(){

num=5;//如果声明变量不加var，不是变量，变成window下面的全局的属性。

}

fn();

alert(num);//5*/

//作用域链

/*var a=1;//全局

function fn(){

//var a=5;//局部

alert(a);//1

}

fn();*/

var a=1;

function fn(){

//var a=5;

function fn1(){

//var a=10;

alert(a);//10 5 1

}

fn1();

}

fn();

</script>

<!--<script type="text/javascript">

alert(a);//a is not defined

</script>

var a=20;

</script>

alert(a);

</script>-->

</body>

//问题：

//为什么变量前置访问输出undefined

//为什么函数可以任何地方进行调用。

//js预解析分为两步：1.预编译期 2.执行期

//1.预编译期：程序在浏览器执行之前要干的事情--默认完成

//首先找var 和 function

//找到var提前赋值 undefined给变量，找到函数提前将整个的函数体赋值给函数。

//如果函数和变量出现重名，函数优先。

//函数的内部同样也要做预解析。

//函数的形参就是函数的局部变量(默认有var)

//2.逐行执行：代码一行一行逐行解读，遇到错误终止。

//函数声明跳过，没有调用，当中函数不存在。

/*alert(a);//function a(){ alert(123) }

var a=10;

function a(){

alert(123);

}

a();//报错*/

/*alert(a);//undefined

var a=10;

alert(a)//10*/

/*fn();//123

function fn(){

alert(123);

}

fn()*///123

/*function fn(){

alert(123);

fn();

}

fn();*/

//递归函数就是函数调用函数自身。

//递归如果不添加基点，出现栈溢出。

//5!=5*4!;

//4!=4*3!;

//3!=3*2!;

//2!=2*1!;

//1!=1

/*function jc(n){

return n*jc(n-1);

}

//RangeError: Maximum call stack size exceeded

alert(jc(5))*/

/*function jc(n){

if(n==1){

return 1;

}else{

return n*jc(n-1);

}

alert(jc(5));//120*/

//利用递归求斐波那契数列的前20项。（又叫兔子数列）

//1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233，377，610，987，1597，2584，4181，6765

//规则：第一个数+第二个数=第三个数.

function fb(n){//n:位置

if(n==1 || n==2){//基点

return 1;

}else{

return fb(n-1)+fb(n-2);

}

alert(fb(7));

1.下面答案是多少
AA();
function AA(){
alert('AA')
};
BB();
var BB = function(){
alert('BB');
};

1. AA
2. BB is not a function

2.下面答案是多少
var a=1
function fn(a){
console.log(a)
a=2
console.log(a);
}
fn(a)
console.log(a)

1. 1
2. 2
3. 1

3.下面答案是多少
var a=1;
function fn(){
console.log(a)
var a=2; //如果将这个var关键字去掉答案是多少
}
fn()
console.log(a)

4.界面会弹出几次结果？分别是什么？为什么？
alert(a);
a();
var a=3;
function a(){
alert(10);
}
alert(a);
a=6;
a();

Math.random()随机产生一个0-1之间的数，不包括1

猜你喜欢