欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js流程控制/方法简化/函数参数过多过少处理

程序员文章站 2022-05-26 12:42:19
...

流程控制

顺序:(默认)

分支:单分支,双分支,多分支

  • 单分支
    1. if(condition){
    2. ...
    3. }
  • 双分支
    1. if(condition){
    2. ...
    3. }else{
    4. ...
    5. }
    6. (condition) ? ... : ... ;
  • 多分支
  1. if(condition){
  2. ...
  3. }else if(condition2){
  4. ...
  5. }else{
  6. ...
  7. }
  8. //区间判断传true , 单值判断传变量
  9. switch(true){
  10. case condition:
  11. ...
  12. break;
  13. case condition2:
  14. case condition3:
  15. //case可以多个
  16. ...
  17. break;
  18. default:
  19. ...
  20. }

循环:单分支的重复执行

  • 获取数组长度 array.length
    1. let array = [1,2,3];
  • while循环
    1. i = 0;
    2. while (i < array.length) {
    3. console.log(array[i]);
    4. //更新条件
    5. i++;
    6. }
  • do while循环(不论真假都会先执行一次)
    1. i = 0;
    2. do {
    3. console.log(array[i]);
    4. //更新条件
    5. i++;
    6. }while(i < array.length)
  • for 循环
    1. for (let i=0;i<array.length;i++){
    2. console.log(array[i]);
    3. }
  • for of 循环(entries转换为键值)
    1. for(let item of array.entries){
    2. console.log(item);
    3. }
  • for in 循环
    1. for (let key in obj){
    2. console.log(obj[key]);
    3. }
  • map 循环
  1. // item循环中数据/index键/数据
  2. obj.map((item,index,array)=>{
  3. return item;
  4. });
  5. //案例
  6. let a = [
  7. {"name":"1号",num:1,param:[{'color':"red"}]},
  8. {"name":"2号",num:2,param:[{'color':"blue"}]},
  9. {"name":"3号",num:3,param:[{'color':""}]},
  10. {"name":"4号",num:4},
  11. {"name":"5号",num:5},
  12. ];
  13. a.map((item)=>{
  14. item['color'] = item['param'] && item['param'][0]['color']?item['param'][0]['color']:'';
  15. return item;
  16. });
  • reduce 循环
  1. // prev上次return的数据/item循环中数据/index键/数据
  2. obj.reduce((prev,item,index,array)=>{
  3. return item;
  4. });
  5. //案例
  6. var arr = [1, 2, 3, 4];
  7. var sum = arr.reduce(function(prev, cur, index, arr) {
  8. console.log(prev, cur, index);
  9. return prev + cur;
  10. })
  11. console.log(arr, sum);

函数参数默认值

  1. const f = (a,b=0)=>{
  2. return a + b;
  3. }

函数参数过多

  1. const f = (a,...b)=>{
  2. return b;//把剩余参数放入数组中
  3. }

三点运算符

  • 数据集展开
    1. console(...[1,2,3,4]);
    2. // 1 2 3 4
  • 参数过多
    1. let f = (a,b,...arr)=>{
    2. return arr;
    3. }

简化

  • 方法简化
    1. let name = 'name';
    2. const user = {
    3. name,//name:name(原)
    4. getName(){
    5. return this.name;
    6. },
    7. //原
    8. //getName:function(){
    9. // return this.name
    10. //}
    11. }