JS里面的 const 和 => 箭头函数的用法

分手后的思念是犯贱 2022-04-10 04:26 200阅读 0赞

在搞前端代码时，发现有一个JS工具类处理系统时间转换里面有这样的代码,主要两处有疑惑一个是const，看起来很眼熟，另一个是=>，我看一些地方回调方法也用到它

const MsFormatToMMSS = ms => {
      var second = Math.floor(ms / 1000);
      var mm = Math.floor(second / 60);
      var ss = formatNumber(second % 60);
      return mm + ":" + ss;
    }

（一）const  
const其实看名字意思其实就可以猜的差不多（C里面的const修饰词 或者Java final修饰词 —貌似这俩个还是有区别的C里面的可以通过指针来改变常量）

这里的const也是JS的常量，但是还有一个跟他很像的叫做let。常量是块级作用域，很像使用 let 语句定义的变量。常量的值不能通过重新赋值来改变，并且不能重新声明。作用很多语言都有就是保证被修饰的对象不被改变，下面是例子(可以把const换成let试一下，跟关键词var写法还是有区别比如对“;”结尾，var直接","搞起 还有就是要想尝试再给一个值不报错，要加\{\})

const testConst=  "Hello World";
        {
          const testConst = "Hello ZP"
        } 
        console.log("======"+testConst+"==========")

下面是资料链接  
[《MDN上关于const的解释》][MDN_const]  
[《MDN上关于let的讲解》][MDN_let]  
[《stackoverflow上关于JS的const和var的提问与回答，挺不错的》][MDN_const]

（二）箭头函数  
箭头函数可以看做类似于三元表达式的东西，他可以使你的程序写起来更简洁更优雅，  
基础语法  
(参数1, 参数2, …, 参数N) => \{ 函数声明 \}  
//相当于：(参数1, 参数2, …, 参数N) =>\{ return 表达式; \}  
(参数1, 参数2, …, 参数N) => 表达式（单一）  
// 当只有一个参数时，圆括号是可选的：  
(单一参数) => \{函数声明\}  
单一参数 => \{函数声明\}  
// 没有参数的函数应该写成一对圆括号。  
() => \{函数声明\}

高级语法  
//加括号的函数体返回对象字面表达式：  
参数=> (\{foo: bar\})

//支持剩余参数和默认参数  
(参数1, 参数2, …rest) => \{函数声明\}  
(参数1 = 默认值1,参数2, …, 参数N = 默认值N) => \{函数声明\}

//同样支持参数列表解构  
let f = (\[a, b\] = \[1, 2\], \{x: c\} = \{x: a + b\}) => a + b + c;  
f(); // 6

比如

function funcName(params) {
       return params + 66;
     }
    funcName(6);

可以把这个函数fnc写成

var funcName = (params) => params + 66
    funcName(6);

资料链接  
[MDN上箭头函数的讲解][MDN]

[MDN_const]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/const
[MDN_let]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let
[MDN]: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions