循环结构,函数

while循环结构:

while中文名字叫当....时,其实就是当条件满足的时候执行的代码,一旦不满足了就不执行代码。

语法:
   while(条件语法){
条件成立执行的代码
}

// 1. 初始化条件
var num = 0; 
// 2. 条件判断
while(num<=10){
// 3.要执行的代码
    documnt.write("我爱你");
// 4.自身改变
   num = num + 1;
}

do while 循环

一个和while循环类似的循环,while会先进行条件判断,满足就执行,不满足就不执行。但是do while循环是先执行一次,在进行判断。

语法:do {要执行的代码} while(条件)
    // 下面这个代码,条件一开始就不满足,但是依旧会执行一次 do 后面{}内部的代码
 var num = 10;
 do {
   console.log('我执行了一次');
   num = num + 1;
 } while (num < 10);
     

for 循环

和while , do while 循环都不太一样的一种循环结构

语法: for(var i =0; i < 10; i++) {要执行的代码}

//把初始化,条件判断,自身改变,写在了一起
for (var i = 1; i <= 10; i++) {
//这里写的是要执行的代码
    console.log(i);
}
//控制台会依次输出 1~10

break 终止循环

在循环没有进行完毕的时候,因为我设置的条件满足,提前终止循环。要终止循环,就可以直接使用break关键字。

比如:吃五个包子吃完第三个不想吃了就可以用break终止吃包子了。

for (var i=1; i<=5; i++){
//每循环一次,吃一个包子
console.log('我吃了一个包子');
//当i的值为3的时候,条件为true,执行{}里面的代码终止循环
//循环就不会继续向下执行了,也就没有4和5了
if(i===3) {
   break;
  }
}

continue结束本次循环

在循环中,把循环的本次跳过去,继续执行后面的循环。跳过本次循环,就可以使用continue关键字。

比如:吃五个包子吃到第三个,第三个掉地上了,不吃了,就可以用continue跳过第三个,继续吃第四个和第五个。

for (var i =1; i <= 5; i++) {
    //当i的值为3的时候,执行{}里面的代码
    //{}里面有continue,那么本次循环后面的代码都不执行了
    // 自动算作i为3的这一次结束了,去继续执行 i = 4 的那次循环了
if (i===3) {
   console.log('这个是第三个包子,掉地下了,我不吃了');
   continue;
 }
  console.log('我吃了一个包子');
}

循环的嵌套

让一段重复执行代码重复执行,就是设定一个大程序,让多个人跑5圈。

for (var i=1; i<=5; i++){
    for(var j=1;j<=5; j++){
        document.write("第" + i "个人跑第" + j + "圈<br>");
    }
}

函数的创建

函数声明:

//函数声明式创建函数
function f1() {
   //需要编写的代码
}
//function:声明函数的关键字,表示接下来是一个函数了
//f1:函数的名字,我们自己定义的(遵循变量名的命名规则和命名规范)
//():必须写,是用来放参数的位置
//{}:就是我们用来放一段代码的位置(也就是我们刚说的“盒子”)

字面量方式创建(赋值式)

var f2 =function() {
    //需要编写的代码
}

使用Function构造函数创建

var f3 =new Function('参数1','参数2',...,'函数要执行的代码段');
//构造函数的参数中最后一个参数为函数体的内容,其余均为函数的形参

函数的返回值

函数体中return语句给函数一个返回值或者终止函数的执行。当return语句被执行时,函数立即返回而不在执行剩余的代码。

//终止函数的执行
function fn() {
      console.log(1)
      console.log(2)
      console.log(3)

     //写了return以后,后面的4和5就不会继续执行了
     return
     console.log(4)
     console.log(5)
}
 
  //函数调用
fn();

return语句后面跟上你要返回的数据(可以是一个表达式,可以是任意的数据类型)

 function fn() {
  //执行代码
   return 100
}
 
//此时,fu()这个表达式执行完毕之后就有结果出现了
 console.log(fu())//100 

函数总是有一个返回值,如果函数体中没有return语句或者return后面为空,那么函数将总式返回undefined

function fn() {
 //执行代码
}

 //fu()也是一个表达式,这个表达式就没有结果出现
 console.log(fu())//undefined

匿名函数

当声明一个函数,没有函数名的时候,那么这个函数就称之为匿名函数

function() {
  //编写的代码
}

声明式创建函数和赋值式创建函数的区别

声明式函数:调用可以在定义之前或者定义之后调用

//可以调用
fn();
 
//声明式函数
 function fn(){
     console.log('我是')
}

 //也可以调用
 fn();

字面量赋值式函数:调用只能在定义函数的后面

//不可以调用(会报错)
fn();

//赋值函数
var fn =function(){
  console.log('我是')
}

//可以调用
fu();

函数的嵌套

函数结构中的大括号中可以写函数的定义,可以写函数的调用:

function fn() {
  console.log(1)
   function fun() {
     console.log(2)
}
 fun()

}
fn()

function fn(){
   console.log(1)

}
function fun() {
  fn()
  console.log(2)

}
fun();

递归函数

递归函数就是在函数中调用自己。

//求10的阶和,即:10+9+8+7...+1
function facSum(num){
    if(num == 1){
       return 1;
    }
   return num + facSum(num-1);
}
var res = facSum(10);
console.log(res); //55

事件

<button id="btn">按钮</button>
<script type="text/javascript">
	btn.onclick = function(){
		alert("点击了按钮!");
	}
</script>

事件类型

onclick  当鼠标左键单击 

ondblclick   当鼠标左键双击 

onmouseover   当光标在指定的内容上面

onmouseout  当光标离开指定的内容

onkeydown  当键盘按下的那一刻

onkeyup   当键盘抬起的那一刻

onfocus  当输入框得到焦点

onblur  当输入框失去焦点

onchange  当指定的标签里面内容有变化的时候

onsubmit  提交事件

onload   当整个网页加载完成后

事件的其他写法:

//给事件赋值函数名称
btn.onclik = fn
function fn(){
  console.log('点击了按钮')
}
//给事件赋值变量名,值是函数
var fn =function(){
  console.log('点击的按钮')
}

注意:如果给事件赋值函数名,千万不能加小括号调用。

事件还可以写在行内:

//直接在行内写js代码
<button onclick="console.log('点击了按钮')">按钮</button>
<!-- 可以在行内调用函数 -->
<button onclick="fn()">按钮</button>
<script>
    function fn(){
        console.log('点击了按钮')
    }
</script>

注意:在行内的事件中调用函数一定要加小括号调用才行

对象

概念:复杂数据类型,在一个内存中,存储多个小内存空间

定义:var obj={键:值,键:值,....}

var obj=new Object() //空对象

对象的操作:获取值:对象.键。对象[ 键 ]

设置键值对:对象.键=值。对象.[ 键 ]=值

删除键值对:delete 对象.键。delete 对象[ 键 ]

对象遍历:语法:for(var 变量 in 对象){变量代表每个键,值:对象[变量]}

如果对象的值是非函数,叫属性,对象的值是函数,叫方法。

构造函数:当一个函数被new来创建对象是,这个函数就叫构造函数。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值