美文网首页首页投稿(暂停使用,暂停投稿)
一名前端工程师的自学之路!Js篇(11-17更新)

一名前端工程师的自学之路!Js篇(11-17更新)

作者: 自律更自由 | 来源:发表于2017-11-18 00:07 被阅读20次

    看到标题能进来的小伙伴,我也就不废话,先推荐一本必买的书《JavaScript高级程序与设计》。今天接着上一篇文章还是分享最基础入门的一些Js的知识。

    1、选择结构 (判断)

    单分支选择结构:

    控制语句:

        if(表达式){

            语句组;

        }

    说明: 表达式 一般为 条件表达式 或 逻辑表达式

    执行逻辑:

    如果if后面的表达式为真true,就执行语句组。

    如果if后面的表达式为假false,就跳出if语句

    控制语句:

        if(表达式){

            语句组;

        }else{

        语句组;

        }

    执行逻辑:

    如果if后面的表达式为真,就执行if语句组,否则就执行else

    图示:

    js中布尔环境下if语句,下面的代表真假两种情况:

    所有数字为真,0为假

    所有字符串为真,空字符串为假

    null 和 undefined 为 假

    所有对象为真

    2、代码规范(扩展)

    嵌套的代码必须缩进(tab )

    每条语句结束后 可以用 分号或换行符 直接换行结束该语句 (建议用分号结束)

    所有的标点符号 都是 英文半角状态

    所有的代码严格区分大小写

    3、多分支选择结构

    控制语句:

        if(表达式1){

            语句组1;

        }else if(表达式2){

            语句组2;

        }else if(表达式3){

            语句组3;

        }else{

            语句组n;

        }

    执行逻辑:

    首先判断表达式1,如果结果为真,执行语句组1

    如果结果为假,继续判断表达式2,执行逻辑同上.....

    图示:

    4、if语句的嵌套

    语法结构:

        if(表达式1){

            if(表达式2){

            }

        }else{

            if(表达式3){

            } 

        }

    5、关于if使用时需要注意的问题总结

    else 后面不能有条件

    else 可以省略的

    else 永远与它同级的 并 离他最近的 if 语句配对

    if 或 else 后面如果有多条语句,必须要用{}括起来

    if 或else 后面如果只有一条语句,{} 是可以省略的 (初学者不建议省略)

    6、多分支结构 switch ( 开关语句 )

    语法结构:

        switch( 表达式 ){

            case 常量表达式1 : 语句1;

            case 常量表达式2 : 语句2;

            .....

            default : 语句 n;

        }

    关于switch语句的几点说明:

    switch表达式 一般为 常量表达式 或 变量

    default 后面 没有条件

    default 可以省略

    如果case 后面的语句没有break ,会实现 case 穿透 (会继续向下执行)

    执行逻辑:

    用switch的表达式的值和case常量表达式的值做比较,如果相等,就执行该case对应的语句

    如果case 语句后面 有break , 则可中断switch

    如果case 语句后面 没有break,则实现case 穿透, 继续向后执行

    7、多分支switch 和 if的使用场景

    一般条件是一个范围的时候,可以使用if

    一般条件是一个具体值时,使用switch可以提高效率

    8、while循环

    while循环也叫 当型循环

    控制语句结构:

    while(表达式){

    循环体;

    }

    说明:

    表达式一般为条件表达式 ,也就是循环终止条件

    循环体就是反复执行的任务

    循环要素:

    循环变量,用来控制循环

    循环变量的初始值

    循环变量的终值(循环条件)

    循环变量增值(步长) 控制循环次数

    循环体

    执行逻辑:

    首先判断表达式是否成立,如果表达式不成立,循环体一次也不执行,直接跳出循环体

    如果表达式成立, 执行循环体,然后在判断表达式,直到表达式不成立退出整个循环

    9、do...while 循环

    do...while 循环 也叫做 直到型 循环

    控制语句:

        do{

            循环体

        }while(表达式);

    执行逻辑:

    首先执行一次循环体,然后再判断表达式,如果表达式为假,退出循环

    如果表达式为真,继续执行循环体,直到表达式为假,退出循环

    10、while循环 和 do..while循环的区别

    while循环 先判断,后执行,循环体可能一次也不执行

    do...while循环 先执行,后判断 ,循环体至少要执行一次

    11、for循环

    控制语句:

        for(表达式1;表达式2;表达式3){

            循环体

        }

    说明:

    表达式1 通常表示为循环变量赋初始值

    表达式1 可以省略,提到for的上面

    表达式2 通常表示循环条件(终值)

    表达式2不能省略,如果省略了表达式2,就会出现死循环

    表达式3 通常表示循环变量增值(步长)

    表达式3可以省略,提到循环体中

    执行逻辑:

    先执行表达式1,再判断表达式2,如果表达式2不成立,直接退出循环体

    如果表达式2成立,执行循环体,再执行表达式3,再判断表达式2,直到表达式2为false退出循环

    最后推广一下自己的小程序,如果你也喜欢锻炼的话在这里寻找你的小伙伴吧。

    自律更自由,一只喜欢锻炼的程序猿,嘿嘿。

    你都看到这里了,不点个关注嘛~

    相关文章

      网友评论

        本文标题:一名前端工程师的自学之路!Js篇(11-17更新)

        本文链接:https://www.haomeiwen.com/subject/kuisvxtx.html