循环结构，函数

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来创建对象是,这个函数就叫构造函数。