- 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 关键字来声明,后跟一组参数以及函数体。
- 普通函数声明
- 函数表达式:函数赋值给变量(自执行函数、事件处理函数)
- 函数的参数包括形参和实参,参数的传递是将实参传递给形参,函数的形参相当于函数内部的局部变量
- 函数不介意传递进来多少参数,也不会因为参数不统一而错误。
- 函数体内可以通过 arguments 对象来接收传递进来的参数(实参)
函数都有一条return语句,return语句导致函数停止执行,并返回它的表达式的值给调用者。 如果return语句没有相关的表达式,则返回undefined。
- 事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间。可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码。
- 鼠标事件,当用户通过鼠标在页面上执行操作时触发;(焦点事件)
- 键盘事件,当用户通过键盘在页面上执行操作时触发;
- (事件处理函数)
任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期。
全局变量:整个程序都有效,即整个代码中都可以调用。
局部变量:只对函数内部有效,即只能在本变量声明的函数内部调用。
在函数体内,局部变量的优先级高于同名的全局变量。
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()
//所有的方法来自于--函数。
<script type="text/javascript">
//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>
<script type="text/javascript">
//函数的组成:
/*function 函数名(形参){
函数体
return //函数的返回值,同时终止函数,return后面的代码不执行了
}*/
/*function fn(str){
console.log(str);
return '返回值:'+str;//函数的返回值,同时终止函数,return后面的代码不执行了
console.log('hehe');//不会执行了。
}
alert(fn('hello,javascript'));*///函数的返回值
//1.函数的参数功能是什么:扩展函数功能。
//2.函数任何地方调用。
//
</script>
<script type="text/javascript">
/*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>
<script type="text/javascript">
//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>
<div id="box" style="background: red;">123456</div>
<script type="text/javascript">
//对象:属性+方法(被动的/主动的)
//主动的方法
//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>
<style type="text/css">
*{
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 id="box">
<img src="img/1.jpg" alt="" id="img1" />
<a href="javascript:;" id="left"><</a>
<a href="javascript:;" id="right">></a>
</div>
<script type="text/javascript">
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>
<script type="text/javascript">
//输入一个日期,判断这个日期是这一年的第几天 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>
<input type="text" id="txt" value="请输入内容"/>
<script type="text/javascript">
//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>
<script type="text/javascript">
//问题:
//为什么变量前置访问输出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>
<script type="text/javascript">
//任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围
//即作用域控制着变量与函数的可见性和生命周期。
//全局变量:整个程序都有效,即整个代码中都可以调用。
//局部变量:只对函数内部有效,即只能在本变量声明的函数内部调用。
//在函数体内,局部变量的优先级高于同名的全局变量--作用域链
/*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>
<script type="text/javascript">
var a=20;
</script>
<script type="text/javascript">
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