• 【重温基础】2.流程控制和错误处理


    本文是 重温基础 系列文章的第二篇,需要让自己静下心来,学习,养成好习惯。

    系列目录:

    本章节复习的是JS中的控制流语句,让我们能实现更多的交互功能。

    注意一点:在ES6之前,JS是没有块作用域的,如果在语句块外部声明的变量,如果在块内部声明一个相同名称的变量,那么程序将取后声明的这个变量的值:

    var a = 1;
    {
        var a = 2;
    }
    a; // 2
    

    但是ES6开始,用let声明的变量是块作用域的:

    let a = 1;
    {
        let a = 2;
    }
    a;  // 1
    

    1.条件判断语句

    用于根据指定条件返回结果,常见的是if...elseswitch

    if…else语句

    若条件为,则执行if后面的语句,若条件为,则执行else后面的语句:

    if(condition){
        // do something
    }else{
        // else 为可选
        // do something
    }
    

    False等效值
    在JS中下面的值常常被计算为false

    • false
    • undefined
    • null
    • 0
    • NaN
    • 空字符串("")

    注意
    不要使用原始布尔值truefalse 与 Boolean对象的真和假混淆:

    let a = new Boolean(false);  // Boolean {true}
    if (a);         //  永真
    if (a == true); // 永假 
    

    2.switch语句

    通过匹配表达式的值到每个case标签,若匹配成功则执行相关语句:

    switch ( 'leo' ){
        case 'pingan':
            // do something
            break;   // 可选
        case 'leo':
            // do something
            break;
        default:  // 都不匹配 则执行默认
            // do something
            break;
    }
    

    break为可选,目的用于保证在正确匹配后,能跳出程序的switch语句,并继续执行其他代码,若没有break则程序会继续执行下一个case语句。

    3.异常处理语句

    throw语句抛出的异常,我们可以使用try...catch捕获并处理,这里需要先介绍两个概念:

    throw语句:

    用于抛出异常,后面可以是任何表达式:

    throw "error !";
    throw 404;
    throw {msg: 'err'};
    

    try…catch语句:

    用于捕获异常,try后面是程序正常时候执行的程序,catch后面是当前面有错误抛出的时候执行,并且捕获错误信息作为参数,并且在catch块执行完成,参数不可再用。

    function f(){
        throw 'test error!'
    }
    try{
        f();
        console.log('success');
    }catch (err){    // err 为前面返回的错误信息
        console.log(err);
        console.log('failed');
    }
    // test error!
    // failed
    

    通常在try...catch后还有一个finally语句块,用于不论前面是否有报错,都会执行finally语句:

    try{
        // do something
    }catch(err){
        // do something
    }finally{
        // do something
    }
    

    try...catch常常也用在做网络请求的情况下:

    function getData (){
        try{
            let a = fetch(url);
        }catch(err){
            console.log(err);
        }
    }
    

    参考资料

    1.MDN 流程控制与错误处理


    本部分内容到这结束

    Author 王平安
    E-mail pingan8787@qq.com
    博 客 www.pingan8787.com
    微 信 pingan8787
    每日文章推荐 https://github.com/pingan8787/Leo_Reading/issues
    JS小册 js.pingan8787.com

    bg

    个人博客:http://www.pingan8787.com 微信公众号【前端自习课】和千万网友一起,每日清晨,享受一篇前端优秀文章。 目前已连续推送文章 600+ 天,愿每个人的初心都能一直坚持下去!
  • 相关阅读:
    phpmyadmin的登陆配置
    修改xampp-mysql密码
    php实现获取汉字笔画数
    Java学习路线图,专为新手定制的Java学习计划建议
    高德地图Bug 'NSInternalInconsistencyException', reason: 'Invalid parameter not satisfying: !stayUp || CLClientIs
    BitCode
    解决 The sandbox is not sync with the Podfile.lock问题时候,如下所示
    iOS时间戳与字符串
    自定义大头针标注泡泡视图无法响应事件
    'The sandbox is not sync with the Podfile.lock'问题解决
  • 原文地址:https://www.cnblogs.com/pingan8787/p/11838229.html
Copyright © 2020-2023  润新知