博客列表 >数组与对象的解构,实例演示常用流程控制方法

数组与对象的解构,实例演示常用流程控制方法

吳
原创
2021年01月02日 15:13:37702浏览

1.数组与对象的解构

  • 对象结构

    1. ({ name, age } = { name: '吴彦祖', age: 28 });
    2. console.log(name, age);
  • 数组解构

    1. const colors = ['red', 'blue', 'green'];
    2. let [color1, color2, color3] = colors;
    3. console.log(color1, color2, color3);

2.常用流程控制方法

  • 流程控制:分支

    1. <script>
    2. let fs = 69;
    3. // 单分支
    4. if (fs >= 60) console.log('及格了:单分支');
    5. console.log('------------');
    6. // 双分支
    7. if (fs >= 60) console.log('及格了:双分支');
    8. else console.log('不及格');
    9. console.log('--------------');
    10. // 多分支
    11. if (fs >= 60 && fs < 80) console.log('合格:多分支');
    12. else if (fs >= 81 && fs <= 100) console.log('优秀');
    13. // // 判断成绩是否合法
    14. else if (fs >= 100 || fs < 0) console.log('非法成绩!');
    15. // // 默认分支
    16. else console.log('不合格');
    17. console.log('--------------');
    18. // switch简化多分支:switch通常不会去做区间判断,而是用于单值判断
    19. fs = 71;
    20. switch (true) {
    21. case fs >= 60 && fs < 80:
    22. console.log('合格:switch'); break;
    23. case fs >= 81 && fs <= 100:
    24. console.log('学霸'); break;
    25. case fs > 100 || fs < 0:
    26. console.log('非法成绩!'); break;
    27. default: console.log('不合格');
    28. }
    29. console.log('----------------------');
    30. let zt = 'Success'
    31. // 对于单值的字符器需要将格式统一化,例如全转为大写或小写
    32. switch (zt.toLowerCase()) {
    33. case 'fail':
    34. console.log('请求失败'); break;
    35. case 'success':
    36. console.log('请求成功:使用switch单值判断状态'); break;
    37. case 'error':
    38. console.log('参数错误'); break;
    39. default: console.log('未知错误');
    40. }
    41. console.log('-----------------------');
    42. // 双分支
    43. fs = 69;
    44. // 使用三元运算来简化"双分支"
    45. console.log(fs >= 60 ? '及格了:三元运算' : '不及格');
    46. </script>
  • 流程控制:循环

    1. <script>
    2. const arr = [1, 2, 3, 4];
    3. // console.log(arr.length);
    4. // while:入口判断型
    5. // 初始化循环变量
    6. let i = 0;
    7. while (i < arr.length) {
    8. console.log(arr[i]);
    9. // 更新循环条件
    10. i++
    11. }
    12. console.log('--------------------');
    13. // do - while:出口判断型
    14. // i = 0;
    15. // do {
    16. // console.log(arr[i]);
    17. // i++
    18. // } while (i < arr.length)
    19. // for (初始化循环变量;设置循环条件;更新循环条件){...}
    20. // for (let i = 0; i < arr.length; i++) console.log(arr[i]);
    21. // 循环与分支经常混编
    22. for (let i = 0; i < arr.length; i++) {
    23. // 只输出前三个
    24. if (i < 3) console.log(arr[i]);
    25. // 以下二行可实现同样的功能
    26. // if (i >= 3) break;
    27. // console.log(arr[i]);
    28. // if (arr[i] % 2 === 0) continue;
    29. // console.log(arr[i]);
    30. }
    31. console.log('-------------------');
    32. // 对象的遍历
    33. // fon - in
    34. const user = {
    35. id: 8,
    36. name: '吴彦祖',
    37. email: 'wyz@qq.com',
    38. };
    39. for (let key in user) {
    40. console.log(`${key} => ${user[key]}`);
    41. }
    42. console.log('---------------------');
    43. for (let value of arr) {
    44. console.log(value);
    45. }
    46. </script>
声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议