JS

Posted 2020-10-05

　　上周给大家介绍了一下JS基础中一点东西，今天给大家介绍一下JS基础中一个重要部分，循环和函数。

04-JS中的循环结构

　　一、【循环结构的步骤】

　　1、首先要先声明循环变量。

　　2、判断循环条件

　　3、执行循环体操作

　　4、更新循环变量

　　然后循环执行2-4，直到条件不成立时跳出循环。

　　二、【while循环】

　　1、while循环()中的表达式，运算结果可以是多种类型，但是最终都会转为真假，转换规则同if结构

　　（1）、boolean类型：true为真，false为假

　　（2）、string类型：所有非空字符串为真，空字符串为假

　　（3）、number类型：一切非零数字为真，零为假

　　（4）、null、undefined、NaN：全为假

　　（5）、object类型：全为真。

　　2、代码示例：

　　　　var num=1;                                           //声明循环变量
　　　　while (num<=10){                                 //判断循环条件
　　　　　　document.write(num+"<br />");
　　　　　　num++;                                         //更新循环变量
　　　　}

　　3、while循环的特点：先判断，后执行

　　三、【do-while循环】

　　1、do-while循环与while循环几乎是一模一样的，唯一不同的便是do-while循环特点：先执行，后判断，即使初始条件不成立，do-while循环也执行一次

　　2、代码示例：

　　　　var num=10;
　　　　do{
　　　　　　document.write(num+"<br/>");
　　　　　　num--;
　　　　}while(num>=0);

　　四、【for循环】

　　1、for循环有三个表达式：声明循环变量；判断循环条件；更新循环变量。

　　2、三个表达式之间用分号分隔，三个表达式都可以省略，但是两个分号缺一不可。

　　3、for循环的执行特点：先判断后执行；与while相同。

　　4、for循环三个表达式都可以有多部分组成：第二部分多个判断条件用&& ||链接，第一三部分用逗号分隔。

　　5、代码示例：　

　　　　for (var num =1,num1=10;num<=10;num++,num1--) {
　　　　　　document.write(num);
　　　　}

 

　　五、【循环控制语句】

　　1、break：跳出本层循环，继续执行循环后面的语句，如果循环有多层嵌套，则break只能跳出一层。

　　2、continue：跳过本次循环剩余的代码，继续执行下一次循环。

　　（1）、对于for循环，continue之后执行的语句是循环变量更新语句

　　（2）、对于while、do-while循环，continue之后执行的语句是条件判断，因此使用时必须将continue放到i++之后使用，否则continue将跳过i++导致死循环。

　　3、return：只能用在函数中。（后面讲）

　　循环的内容其实不是很多，还有一个循环嵌套的内容，所谓的循环嵌套通俗的讲就是循环中再套着一层循环。循环的内容是比较少，但是在JS中却有着巨大的作用，需要多做练习来掌握，来锻炼自己的逻辑思维能力。练习题网上都能搜到，想要学好循环就去多做练习吧！

05-JS中的函数

　一、【函数的声明及调用】

　　1、函数的声明格式：

 

　　　　function 函数名(参数1，参数2,...){
　　　　　　//函数体代码
　　　　　　return 返回值;
　　　　}

 

　　2、 函数的调用

　　（1）、直接调用：函数名(参数1的值，参数2的值，....);

　　（2）、 事件调用方式：直接在html标签中，使用事件名="函数()"

　　　　eg：<button onmouseout="SaySth(‘你好啊‘,‘red‘)">点击按钮，打印内容</button>

　　3、函数中的注意事项

　　（1）、 函数名必须要符合小驼峰法则，首字母小写之后每个单词首字母大写 ；

　　（2）、 函数名后面的括号中可以有参数，也可以没有参数，分别称为有参函数和无参函数；

　　（3）、 声明函数时的参数列表称为形参列表，形式参数。（变量的名字）;　

　　　　　　　　function saySth(str,color){}
　　　　　　调用函数时的参数列表，称为实参列表，实际参数。（变量的赋值）;
　　　　　　　　saySth("你好","red");

　　（4）、函数的形参列表个数与实参列表个数没有实际关联关系。函数参数的个数，取决于实参列表。如果实参列表的个数<形参列表，则未赋值的形参，将为Undefind。

　　（5）、函数可以有返回值，使用return返回结果，调用函数时，可以使用一个变量接收函数的返回结果。如果函数没有返回值，则接收的结果为Undefined;

　　　　function func(){
　　　　　　return="haha";
　　　　}
　　　　var num=func();//num="haha";

　　（6）、函数中变量的作用域（在js只有函数拥有自己的作用域）

　　>>>在函数中，使用var 声明的变量，为局部变量。只能在函数内部访问；

　　>>> 不用var声明的变量，为全局变量，在函数外部也能访问；

　　>>>函数的形参列表，默认为函数的局部变量，只能在函数内部使用。

　　（7）、函数的声明与函数的调用没有先后之分，即可以在声明函数（检查）前调用函数（执行）

　　二、【匿名函数的声明使用】

　　1、声明一个匿名函数直接赋值给某一个事件

　　　　window.onload=function(){}

　　2、使用匿名函数表达式（称为变量函数），将匿名函数赋值给一个变量

　　　　声明：var func=function(){}

　　　　 调用：func();

　　注意：使用匿名函数表达式时，函数的调用语句必需放在函数生命语句之后！！

　　3、自执行函数：

　　（1）、!function(){}();//可以使用多种运算符开头，一般用!

　　　　　  !function(形参列表){}(实参列表); 

　　（2）、(function(){}())；//使用()将函数及函数后的括号包裹

　　　　      (function(){})()；//使用()只包裹函数部分

　　三种写法的特点：
　　（1）、使用!开头结构清晰，不容易混乱，推荐使用

　　（2）、能够表明匿名函数与调用的()为一个整体，官方推荐使用

　　（3）、无法表明函数与之后()的整体性，不推荐使用。

　　三、【函数的内部属性】

　　1、arguments对象

　　（1）、作用：用于储存调用函数时的所有实参。当我们调用函数并用实参赋值时，实际上参数列表已经保存到arguments数组中，可以在函数中使用arguments[n]的形式调用，n从0开始。

　　（2）、arguments数组的个数取决于实参列表，与形参列表无关，但是，一旦第n个位置的形参、实参、arguments都存在时，形参将与arguments绑定，同步变化（即在函数中修改形参，arguments也会改变，修改arguments的值，形参也会改变）。

　　（3）、arguments.callee 是arguments的重要属性，表示arguments所在函数的引用地址，在函数里面可以使用arguments.callee()调用函数本身。在函数内部调用函数自身的写法叫做递归。

　　（4）、递归分为两部分：递和归。以递归调用语句为界限，可以将函数分为上下两部分

　　　　递：当函数执行上半部分，遇到自身的调用语句时，继续进入内层函数，再执行上半部分，直到执行完最内层函数

　　　　归：当最内层函数执行以后，再从最内层函数开始，逐渐执行函数的下半部分。

　　用一句话概括：当最外层函数执行时，遇到自身的调用语句，会进入内层函数执行，而外层函数的后半部分暂不执行，直到最内层函数执行完以后，再逐步向外执行。　

　　　　//递归调用
　　　　var num = 1;
　　　　function func(){
　　　　　　console.log(num);
　　　　　　num++;
　　　　　　if(num<=4){
　　　　　　arguments.callee();//递归调用语句。
　　　　　　}
　　　　　　num--;
　　　　　　console.log(num);
　　　　}
　　　　func();